「似たような素材が見つからない」と先輩に相談したところ、「夏の前っぽい写真を探せば？」と言ってもらったのでやってみました。 見本・トレース 所感 女性を切り抜いて新しく背景を作ろうと思ったのですが、大変だったのでキラキラを足しました。 柔らか…

見本・トレース 所感 背景は青色のグラデーションにしたが、並べてみるとグラデーションが甘かった。右上をもうちょっと明るく。 「爆速」下の「Word Press」の行間をもっと詰めた方が良かった。 「体感せよ」のボタンの角度が大きすぎた。 文字の縦はちゃん…

ちょこちょこ勉強は進めていたのですが、インプットばかりだったので、久々にバナートレースをしました。 見本・トレース 4回修正しました 出来上がってブログに載せようと画像をアップロードしたのですが、見れば見るほど気になる部分が出てきたので、結局…

見本/トレース ←見本 トレース→ 斜めストライプが見本より太目になってしまいました。 「最大３９％」も、見本の方が白い領域が多かったです。 初めてやったこと 斜めストライプのレイヤーを重ねる 斜めストライプが重なっていることに気づいて、もっとやり…

見本 色合いが気に入ったのと、「SALE」の文字の一部の色を変える方法が知りたかったので、このバナーをトレースすることにしました。 トレース トレースしたバナーがこちらです。 縦を揃えルことを意識して、文字サイズなどを調整しました。ポイント10倍の…

仕事、体調不良で、間があいてしまいましたが、7日目のお題に挑戦しました。お題は「設定画面」でした。 色々考えたのですが勉強のために、TravelNowの設定画面をトレースすることにしました。 トレース 一部のアイコンは自分でパスを引いて作りました。 気…

300*250サイズのトレースをやってきましたが、他サイズのバナーデザインが苦手なので、他のサイズのトレースもはじめていきます。 見本/トレース 考察 「得サブ」の上下の文字は潰れていたので再現できなかった。そもそも文字サイズが小さいので超高画質でも…

見本/トレース 考察 右下の男性の背景が白っぽいので、中央の白の帯が目立たなくなってしまった。写真を入れ替えるといい感じになった。 「独立したいエンジニアに朗報！」というテキスト、一字ずつ右上に配置されていて、文字自体は若干斜めになっている。…

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

見本/トレース 考察 ネイビーとゴールドの組み合わせは高級感がある。 アイコンとテキストの部分は、隣同士のマージンが少ないため若干読みづらさを感じる。 「美術展・イベントなど」の文字数が多く他2つに比べて幅がある。「各種イベントなど」にすると３…

見本/トレース 考察 最初に大きめのロゴをいれると、必ずサービス名が目にとまる。（全く知名度のないサービスだと逆効果かもしれない） 目立たせたい文言（「500」や「31」「無料！」等）の文字サイズを大きくすることでメリハリがつく。 3つのポイントの背…

見本／トレース 所感 青〜緑のグラデーションが目を引きます。グラデーションをかなり調整したのですが、青みが足りないですね。。 このバナーを見た人は「オーディオ広告ってどこに？spotifyか！（または、spotifyって？）くわしくしりたい！」って思ってク…

見本／トレース まとめ 所感 デザイン 使用されている色が少なく、きれいにまとまっています。 「詳しくはこちら」ボタンの左端が斜めになっていることでスタイリッシュさ、スピード感が出ていて好きだなあと思いました。 「カワイイとカッコイイを一つのデ…

最近、いろんな方のブログなどを拝見して、バナーのトレースを100個やるのは当たり前なのか！と知ったので、WEBサイト・アプリのトレースと並行しながら、バナーのトレースを行うことにしました。こちらは毎日やっていきます！ まずは1つめです。お気づきの…

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

対象アプリ Google カレンダーのiOSアプリをトレースしました。 https://www.google.com/calendar/about/ webサイトもかっこいいですね…！ ※DMM AUTOのアプリのトレースをしようと思ったのですが、車を所持していないので肝心な部分に進めることができず断念…

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

対象webサイト https://bosyu.me/ 見本・トレース ログイン後の画面のトレースになるので、割愛します。 トレースしたのは、トップページ、募集作成フォーム、管理画面の3つです。 まとめ 画面操作で迷わず、サクサクすすめられるのが、使っていて楽しかった…

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

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

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

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

きょうからトレースをやるぞ！と決めました。 目標 １週間に１トレース！ WEBサイト、LP交互に行う ふるいたった記事 liginc.co.jp トレースのメリット ・デザインの細部を確認できる ・ 配色やレイアウトなど、デザインのトレンドを学ぶことができる ・ ど…