masayuki

現在は上場メーカーでECサイト運営担当。目標は2021年10月WEBデザイナーに転職す…

masayuki

現在は上場メーカーでECサイト運営担当。目標は2021年10月WEBデザイナーに転職すること。現在はバナー模写 html css JavaScript 勉強中。「人の心に響く、ものづくりをしたい」

記事一覧

今日のバナー模写#81

左が参考バナー 右が模写して制作したバナー 所要時間:40分 デザインの気づき&メモ ・赤い服と左上と右にも同じ色のシェイプをおいて、絶妙なバランスを取っている…

masayuki
3年前
1

今日のバナー模写#80

下が参考バナー 下が模写して制作したバナー 所要時間:40分 デザインの気づき&メモ ・緩やかなカーブはペンツールで作成 ・テキストツールで線にカーソルを持ってい…

masayuki
3年前
1

今日のバナー模写#79

デイトラWEB制作コースの卒業制作のため、バナー模写を一ヶ月おやすみをしておりました。目標の100個投稿まであともうちょっと。再開します。こちらは作って投稿だけできて…

masayuki
3年前
1

今日のバナー模写#78

参考バナー 右 模写して制作したバナー 左 所要時間:40分 デザインの気づき&メモ ・集中線をはじめ下記リンクの方法で試したが等間隔に線を作ることができず…

masayuki
3年前
2

今日のバナー模写#77

左が参考バナー 右が模写して制作したバナー 所要時間:40分 デザインの気づき&メモ ・水彩のにじみを表現したくて選択。以下のリンクを参考。 ・にじみの濃い縁の…

masayuki
3年前
2

今日のバナー模写#76

右が参考バナー 左が模写して制作したバナー 所要時間:30分 デザインの気づき&メモ ・画像はオーダンにて「花束」で検索して見つけた https://pixabay.com/photos/

masayuki
3年前
1

今日のバナー模写#75

下が参考バナー 上が模写して制作したバナー 所要時間:50分 ↓参考サイト デザインの気づき&メモ ・ネオンが楽しそうだったのでサイトを参考に挑戦したが、細かい…

masayuki
3年前

今日のバナー模写#74

右が参考バナー 左が模写して制作したバナー 所要時間:20分 デザインの気づき&メモ ・ドットパターンを復習したくて選択。パターンを作るときは背景を透明にするのが…

masayuki
3年前

今日のバナー模写#73

左が参考バナーで右が模写して制作したバナー 所要時間:30分 デザインの気づき&メモ ▼ノイズなし ▼ノイズあり ・ノイズによって、昔のフィルム写真のイメージ、…

masayuki
3年前

今日のバナー模写#72

左が参考バナー 右が模写して制作したバナー 所要時間:20分 デザインの気づき&メモ ・要素が少ないときは周りに色枠を作ってボリュームを作る ・「TIMESALE」と「70…

masayuki
3年前
1

今日のバナー模写#71

右が参考バナー 左が模写して制作したバナー 所要時間:40分 デザインの気づき&メモ ・若者向けのバナーは基本可読性よりおしゃれ感重視の印象。 ・図形に沿わせて文…

masayuki
3年前

今日のバナー模写#70

左が参考バナー 右が模写して制作したバナー 所要時間:15分 デザインの気づき&メモ ・まずは70個突破したことが嬉しい。 ・シンプルであしらいが少なかったから比較…

masayuki
3年前
1

今日のバナー模写#69

上が参考バナー 下が模写して制作したバナー 所要時間:90分 デザインの気づき&メモ ・白いびっくり吹き出しは多角形ツール10角形をつくってからパス選択ツールで形…

masayuki
3年前
2

今日のバナー模写#68

左が参考バナー 右が模写して制作したバナー 所要時間:60分 デザインの気づき&メモ ・フォントの種類は3種類で太さも複数種あり、それを正方形のシェイプに整理し…

masayuki
3年前

今日のバナー模写#67

右が参考バナー 左が模写して制作したバナー 所要時間:60分 デザインの気づき&メモ ・いびきだから夜寝る時のイメージカラー青 ・横向き枕専用なのに上むいている。…

masayuki
3年前
1

今日のバナー模写#66

左が参考バナー 右が模写して制作したバナー 所要時間:40分 デザインの気づき&メモ ・下の白い背景は長方形ツールをフィルターぼかし ・光の線は二種類の多角形ツー…

masayuki
3年前
1
今日のバナー模写#81

今日のバナー模写#81



左が参考バナー

右が模写して制作したバナー

所要時間:40分

デザインの気づき&メモ
・赤い服と左上と右にも同じ色のシェイプをおいて、絶妙なバランスを取っている。
・文字のジャンプ率が高いと若者向けの印象。

以上。

お手本のバナーを頂いているサイト
https://retrobanner.net/
http://banner.keizine.net/
https://bannnner

もっとみる
今日のバナー模写#80

今日のバナー模写#80



下が参考バナー

下が模写して制作したバナー

所要時間:40分

デザインの気づき&メモ
・緩やかなカーブはペンツールで作成
・テキストツールで線にカーソルを持っていくと線にそってテキストを入力できるようになる
・参考バナーは冬に赤を「あえて」持ってくることによって、シンプルにもかかわらずかなり目を引くバナーになっている。
・「あえて」と言ったが、クリスマスはイメージカラーに赤があるので、違

もっとみる
今日のバナー模写#79

今日のバナー模写#79

デイトラWEB制作コースの卒業制作のため、バナー模写を一ヶ月おやすみをしておりました。目標の100個投稿まであともうちょっと。再開します。こちらは作って投稿だけできていなかったものです。

下が参考バナー

上が模写して制作したバナー

所要時間:40分

デザインの気づき&メモ
・PEACHのイメージカラーと航空会社なので青空
・私が用意した青空はちょっと暗い。文字の可読性が増した一方でイメージ

もっとみる
今日のバナー模写#78

今日のバナー模写#78



参考バナー 右

模写して制作したバナー 左

所要時間:40分

デザインの気づき&メモ
・集中線をはじめ下記リンクの方法で試したが等間隔に線を作ることができず断念。

https://manemichi.com/ps-comic-syutyusen1

・次に多角形ツールを下記のように作ると見本のようにできた!
 この辺の感はこれまでのバナー模写が生きてきてると実感。

・最後

もっとみる
今日のバナー模写#77

今日のバナー模写#77



左が参考バナー 右が模写して制作したバナー

所要時間:40分

デザインの気づき&メモ
・水彩のにじみを表現したくて選択。以下のリンクを参考。

・にじみの濃い縁の部分まで表現することができなかった。次回リベンジしたい。

お手本のバナーを頂いているサイト
https://retrobanner.net/
http://banner.keizine.net/
https://bannnne

もっとみる
今日のバナー模写#76

今日のバナー模写#76



右が参考バナー

左が模写して制作したバナー

所要時間:30分

デザインの気づき&メモ
・画像はオーダンにて「花束」で検索して見つけた

https://pixabay.com/photos/hand-bouquet-fence-gift-give-1549224/#content

・画像は選択とマスクで切り抜き

・文字をアウトライン化して一時的に不透明度を50%にして花に入り込ませた

もっとみる
今日のバナー模写#75

今日のバナー模写#75



下が参考バナー

上が模写して制作したバナー

所要時間:50分

↓参考サイト

デザインの気づき&メモ
・ネオンが楽しそうだったのでサイトを参考に挑戦したが、細かいところでうまく制御できなかった。かなり難しい。
・文字だけillustratorで作ってからPhotoshopで光と影の加工。それぞれ得意分野を使う。
・やはり手本は、よく見れば見るほどネオンの反射や陰影による立体感など細かい描

もっとみる
今日のバナー模写#74

今日のバナー模写#74



右が参考バナー
左が模写して制作したバナー

所要時間:20分

デザインの気づき&メモ
・ドットパターンを復習したくて選択。パターンを作るときは背景を透明にするのがコツ。
・新しいアートボードで以下のようにドットを配置し、新規パターンを登録→長方形ツールを作りレイヤースタイル→パターングラデーションで作ったパターンを選択し、比率調整。

多分これでもいける↓

このバナーの存在自体は発光色に

もっとみる
今日のバナー模写#73

今日のバナー模写#73



左が参考バナーで右が模写して制作したバナー

所要時間:30分

デザインの気づき&メモ

▼ノイズなし

▼ノイズあり

・ノイズによって、昔のフィルム写真のイメージ、人の優しさ、あたたかさが生まれた印象。
・一方、テキストや斜めのシェイプで、スピード感、躍動を感じ、スポーツらしさ良いバランスが取れている??

以上。

お手本のバナーを頂いているサイト
https://retroban

もっとみる
今日のバナー模写#72

今日のバナー模写#72



左が参考バナー
右が模写して制作したバナー

所要時間:20分

デザインの気づき&メモ
・要素が少ないときは周りに色枠を作ってボリュームを作る
・「TIMESALE」と「70%」が強調されている
・左右は中央だが上下は以外と若干下の方が中央に見える

以上。

お手本のバナーを頂いているサイト
https://retrobanner.net/
http://banner.keizine

もっとみる
今日のバナー模写#71

今日のバナー模写#71



右が参考バナー
左が模写して制作したバナー

所要時間:40分

デザインの気づき&メモ
・若者向けのバナーは基本可読性よりおしゃれ感重視の印象。
・図形に沿わせて文字配置は楽しい。

以上。

お手本のバナーを頂いているサイト
https://retrobanner.net/
http://banner.keizine.net/
https://bannnner.com/
http:/

もっとみる
今日のバナー模写#70

今日のバナー模写#70



左が参考バナー

右が模写して制作したバナー

所要時間:15分

デザインの気づき&メモ
・まずは70個突破したことが嬉しい。
・シンプルであしらいが少なかったから比較的早く完成した。
・文字をはみ出すくらいに大きくしてインパクト。斜めにして躍動感。
・SALEのあしらいはドロップシャドウ×2
・先に水平に全体を作ってからまとめて最後に全選択Ctrl+Tで変形させることで角度をすべて同じに保

もっとみる
今日のバナー模写#69

今日のバナー模写#69



上が参考バナー
下が模写して制作したバナー

所要時間:90分

デザインの気づき&メモ
・白いびっくり吹き出しは多角形ツール10角形をつくってからパス選択ツールで形を整えて、アンカーポイントの切り替えツールでとがらせた。
・背景のドットはアートボード2に下記のように丸を作りパターンを定義でパターングラデーション。
・ドットグラデーションで1時間弱かかった。四角く作る方法が分からず丸い。グラデ

もっとみる
今日のバナー模写#68

今日のバナー模写#68



左が参考バナー

右が模写して制作したバナー

所要時間:60分

デザインの気づき&メモ
・フォントの種類は3種類で太さも複数種あり、それを正方形のシェイプに整理して詰め込むことでおしゃれな印象。
・似た写真素材と似たフォントを探すのに苦労した。
・真ん中のあしらいは「エレガントフレーム 素材」で調べると色々あります。

以上。

お手本のバナーを頂いているサイト
https://ret

もっとみる
今日のバナー模写#67

今日のバナー模写#67



右が参考バナー

左が模写して制作したバナー

所要時間:60分

デザインの気づき&メモ
・いびきだから夜寝る時のイメージカラー青
・横向き枕専用なのに上むいている。使い方まちがっとるやん。根本のところやん。
・いびきの悪いイメージを背景のもやもやのパターンで表現。
・無料素材の迷彩柄を青くして配置。

以上。

お手本のバナーを頂いているサイト
https://retrobanner.

もっとみる
今日のバナー模写#66

今日のバナー模写#66



左が参考バナー

右が模写して制作したバナー

所要時間:40分

デザインの気づき&メモ
・下の白い背景は長方形ツールをフィルターぼかし
・光の線は二種類の多角形ツールを活用。これもフィルターぼかし
・ベッドから影が離れている割に濃い

以上。

お手本のバナーを頂いているサイト
https://retrobanner.net/
http://banner.keizine.net/
h

もっとみる