web

スクロールするとヘッダー/ナビゲーションにシャドウがつく

スクロールするとヘッダー/ナビゲーションバーにボックスシャドウがつくのを取り入れたくて、散々調べたところ理想のソースコードを発見しました。感謝! イメージ 実際の技術は違うかもですが、こういう感じです。 zozotown http://zozo.jp/ slack よりシー…

メールフォーム/コンタクトフォームを作りました

仕事でメールフォーム/コンタクトフォームのデザインと、HTML・CSSのコーディングを行なったので、その時に調べたことなど色々メモします。 リサーチ 入力項目名前、メールアドレス、お問い合わせ内容 など。 入力項目の名称、順番名前を入力させるところの…

sourth treeの使い方メモ

web

基本的な使い方は引き続きこちらを参考にしながら、ちゃんと理解するためにブログにもメモします。随時更新します。 backlog.com プル 他の人が更新した内容を自分のローカルリポジトリに反映させる場合「プル」を使います。 backlog.com リンク先参照の通り…

Googleマップをおしゃれにする

Googleマップをおしゃれにしてくださいと言われたので、色々調べてやってみました。2回目以降はスムーズにできるよう参考にしたサイトやメモをまとめます。 Google APIキーの発行について Googleマップをカスタムして設置するにはAPIキーが必要です。 こち…

最近のこと

ブログへの投稿が久しぶりになってしまいました。 最近、もっぱらコーディングができていなかったので、忘れないように、そして新しい技術を学ぼうと、コーディングを1日最低60分やっています。 こちらで勉強しています CSSグリッドレイアウト デザインブッ…

トレース09

対象サイト LINE Payさんのキャンペーンサイトをトレースしました。スマホサイトです。 10yenpingpong.line.me 見本 トレースしました ※注意事項は省略してトレースしました。※XDを使用しました。 考察 スマホで見たときに最適な文字数、文字サイズ、改行に…

トレース08

対象サイト 憧れているTRYMOREさんが手がけたWEBサイトをトレースしました。デザインはもちろん、スマホで見た時の遊び心があるデザインにも心打たれました。 sp.universal-music.co.jp トレースしてみました まとめ 気づいたことなど こういうの(呼称があ…

トレース06:DMM AUTO

対象webサイト https://auto.dmm.com/ 初めて見たときの印象は、ポップで可愛い!でした。「クルマを売る」ってとてもめんどくさそうで近寄りがたいのに、WEBサイトをみてると楽しいし「わたしにもできそう(クルマもってないけど)」と思えてきたので、デザ…

トレース04

模写させていただいたwebサイト https://sakumastudio.com/ 見本 画像データがアップロードできないので割愛します。 トレース アニメーションがすごかったです。 建築すきなので見ているだけで楽しく、サイトもすごく綺麗だなという印象です。 今回カード形…

トレース03:デジハリ LP

デジハリさんのLPをトレースしました。 模写させていただいたwebサイト https://online.dhw.co.jp/lp/webdesigner/ 見本 トレース 派手じゃないけど、訴求がすごく伝わってくるのは、目立たせたいところでメリハリをつけているからかな?と思いました。 例え…

トレース02:GIG

5/23 23:10 まとめを追記しました 模写させていただいたwebサイト https://giginc.co.jp/ 見本 トレースしてみました アニメーションもトレースできたらいいのにって思いました。 どこをみても、かっこよくて、テンション高まりながら作業していました。 や…

トレース01

模写させていただいたwebサイト http://www.pwc-internship.com/ 見本 ワイヤー ワイヤーとよべるのか?笑 情報の境目に線をいれるなりしないと見返したときに意味不明かも。 反省 トレースしてみました 見出しなど画像が使われていた部分のトレースは、なる…