Illustraorで地図制作。

カフェサイト用地図を作りました!

今日はサイトに載せるためのIllustraorで地図を作ってみました。

サイトのURLはこちらです。(サーバー移設その他事情により非公開にしました!)

地図の作り方で参考にさせて頂いたサイトはこちら。↓


猪股 さん、ありがとうございます!

スマホの画面サイズの時のみ、サイトの連絡先の電話の項目の所から直接発信できるタグも入れてみました。

参考にしたサイトはこちらです。↓


web兄さん 、ありがとうございます!

紙のポートフォリオを更新しなければなぁ:)

今日はなんだか肌寒かったですね。 一日お疲れ様でした。

ご覧頂きありがとうございました☆:)

googleフォント

引き続きサイト制作。フォントを変えて遊んでいます。

こんばんは!

今日は引き続きカフェサイトをいじっています。

googleフォントって便利ですね:)

読み込みまで時間がかかったり、表示されない事があるらしく、トップとh2とかの

一部の文字だけgoogleフォントに変えて遊んでいます。(参考サイトはこちら↓)


FASTCODING BLOGさん、ありがとうございます!
HTMLコーディングやJavaScript、WordPress制作に関する情報が満載です

TOPへ戻るボタンもつけてみました。

サーバーの調子が悪くて変更後のデータをアップできずにいて辛い:<

口コミを元にサーバーを決めたけど、正直、値段に対して使い勝手が悪いので

エックスサーバーはあまりオススメしないです。(笑)

訓練校仲間の情報で教えてもらった「ロリポップ」か「スターサーバー」が良さそうです。コスパよし。

私は契約しちゃったので惰性でエックスサーバーと付き合っていきますw

そういえば、都市伝説好きにはおなじみ、トランスヒューマニスト協会のツイッターで衝撃を受けました。

映画の「ガタカ」の世界感。。。

(このツイッターのかたは遺伝子操作とは何の関係もないのだけど)

「ガタカ」は遺伝子操作により管理された近未来 のお話で、

映画に登場するピアニストさんが

片手の指6本、両手で12本の指を持っている。演奏する曲の楽譜も6本指用の楽曲というシーンがあって。久しぶりに見たくなってしまいました:)

https://movies.yahoo.co.jp/movie/83911/story/

もう10年以上前の映画ですが、それを感じさせないスタイリッシュな映画です。

興味のある方は是非!

それでは。今日はこのあたりで。

ご覧頂きありがとうございました!良い夢を:)

カフェサイト制作!

湖の畔のブックカフェを想定したサイト

今日は嬉しい報告があったのでテンションが上がっております。

昨日に引き続きカフェサイトを作っております。

コーディングをするにあたって、色々調べていたら。。

「できるコーダーさんはとにかくめんどくさがりだ。」

「手間を省いて早く帰ってゲームをする為に全力を尽くす」

という情報がありました。

そういえば、以前挑戦した「テンプレート」は手間を省くはずが、結局初めから自分でコードを打ちなおすはめになるという苦い経験が。。

はい。そこで今回再挑戦してみました!

http://yumisasaki.xyz/cafesite/

今回は順調です!

なんてラクなんだ!そして楽しい!

ありがとうテンプレート。

もっとフォントとかCSSをいじってカスタマイズしたいと思います。

地図も作りたいな:)

そうそう。コリスのツイッターで流れて来ていた情報。共有します!↓

ずっと前から読みたかった「なるほどデザイン」も安くなっていましたので買いました!

バナー職人に役立ちそうな「[買わせる]の心理学 消費者の心を動かすデザインの技法」もお安かったですよ。

気になる方は是非チラ見してみてください。

「ノンデザイナーズ デザインブック」を読めば読むほど、常に「正解ってなに?」と思ってしまっていたというか。。

型や基本は絶対大事だけど。それに沿って考え過ぎてもツマラナイデザインになるし。

ちょっとモヤっと思っていました。

でも、「なるほどデザイン」は楽しくその答えを教えてくれる感じの本でした。

それでは、ご覧頂きありがとうございました!

良い夜を~:)

オーガニック化粧水のLPできました。

BracketsでLP制作

ULRはこちらです↓

https://adjustacademy.com/d1812/d181211/LP/

・コンセプト:ラベンダーやローズウォーター、ハトムギ、カモミールなどのオーガニックハーブ、素材を使用した肌に優しい化粧水のLP制作。

・コンバージョン:お試しキャンペーン購入サイトへの誘導。ブランドイメージアップ。キャンペーンを期に定期会員を増やす。

・ターゲット:20代~30代位の仕事をしている肌ストレスが高めの女性。

・使用アプリ:Brackets/Illustraor/Photoshop

・制作時間:10時間以上

お手本にしたサイトが画像メインで作られていたので真似をしてみました。

お手本として見た複数のサイトはどれも、「今だけ!!!!!!」とか、

色づかいがかなりギラギラ原色系を使っていたり、吹き出しを多く使っていました。

本来LPはもっと派手に解り易い感じが良いのかな。

とも思ったのですが、ブランドイメージアップもコンバージョン設定した時にあげていた事と、オーガニックの優しい製品という点から控えめに、優しいイメージで作りました。

派手さが足りない分、AOSを使って写真の表示の仕方に動きを出してみました。

AOSは初心者の私にもわかりやすくて有難かったです!おすすめです。

AOSの使い方参考サイトはこちら↓


株式会社オンズ さん、ありがとうございます!

やっとなんとなく形にはなりましたが、これからレスポンシブ可とSNS連携のコード入力を勉強して追加予定です。

でも、とりあえずやった!できた!嬉しいです!:)

ポートフォリオサイトも作り直さないとだし。。

やる事がいっぱいです!!w

ではまた。

ご覧頂きありがとうございました!

今日の作業曲:

Webサイト制作 

コーポレートサイト

・コンセプト:空気清浄機販売、環境保全、宇宙開発をしている企業(架空)のWebサイトです。

・ターゲット:綺麗好きで環境問題にも関心が高い20~30代の男女。

・工夫した点:クリーンで透き通った空気をイメージさせる画像を大きく配置し、ベースカラーは#a3b0cdを使用しました。信頼感や爽やかさ、清潔感をイメージさせる#002373をアクセントカラーに使用しました。

・使用アプリ:HTML5(Brackets)/CSS3/jquery/Illustrator/Photoshop

・制作時間:10時間以上

・URL : https://adjustacademy.com/d1812/d181211/Corporate%20website/index.html

星の飛び出す位置が一瞬ズレるので、現在原因究明中です。

まだまだショボくて、コードも汚い。。凹みますが、もっとスライダーやjqueryを沢山つかったシンプルだけどかっこいいサイトが作りたい。

次はレスポンシブ対応に挑戦してみます。