masayuki

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

masayuki

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

最近の記事

今日のバナー模写#81

左が参考バナー 右が模写して制作したバナー 所要時間:40分 デザインの気づき&メモ ・赤い服と左上と右にも同じ色のシェイプをおいて、絶妙なバランスを取っている。 ・文字のジャンプ率が高いと若者向けの印象。 以上。 お手本のバナーを頂いているサイト https://retrobanner.net/ http://banner.keizine.net/ https://bannnner.com/ http://bannermatome.com/ https://r

    • 今日のバナー模写#80

      下が参考バナー 下が模写して制作したバナー 所要時間:40分 デザインの気づき&メモ ・緩やかなカーブはペンツールで作成 ・テキストツールで線にカーソルを持っていくと線にそってテキストを入力できるようになる ・参考バナーは冬に赤を「あえて」持ってくることによって、シンプルにもかかわらずかなり目を引くバナーになっている。 ・「あえて」と言ったが、クリスマスはイメージカラーに赤があるので、違和感はないか。 ・工夫で夏バージョンを作成。より目立つ色にするためビビッドな黄色

      • 今日のバナー模写#79

        デイトラWEB制作コースの卒業制作のため、バナー模写を一ヶ月おやすみをしておりました。目標の100個投稿まであともうちょっと。再開します。こちらは作って投稿だけできていなかったものです。 下が参考バナー 上が模写して制作したバナー 所要時間:40分 デザインの気づき&メモ ・PEACHのイメージカラーと航空会社なので青空 ・私が用意した青空はちょっと暗い。文字の可読性が増した一方でイメージが少し暗くなってしまった。 ・ ・ 以上。 お手本のバナーを頂いているサイト

        • 今日のバナー模写#78

          参考バナー 右 模写して制作したバナー 左 所要時間:40分 デザインの気づき&メモ ・集中線をはじめ下記リンクの方法で試したが等間隔に線を作ることができず断念。 https://manemichi.com/ps-comic-syutyusen1 ・次に多角形ツールを下記のように作ると見本のようにできた!  この辺の感はこれまでのバナー模写が生きてきてると実感。 ・最後に全体にフィルターでノイズをかけてつぶつぶを足すことによって  より中央から飛び

        今日のバナー模写#81

          今日のバナー模写#77

          左が参考バナー 右が模写して制作したバナー 所要時間:40分 デザインの気づき&メモ ・水彩のにじみを表現したくて選択。以下のリンクを参考。 ・にじみの濃い縁の部分まで表現することができなかった。次回リベンジしたい。 お手本のバナーを頂いているサイト https://retrobanner.net/ http://banner.keizine.net/ https://bannnner.com/ http://bannermatome.com/ https://

          今日のバナー模写#77

          今日のバナー模写#76

          右が参考バナー 左が模写して制作したバナー 所要時間:30分 デザインの気づき&メモ ・画像はオーダンにて「花束」で検索して見つけた https://pixabay.com/photos/hand-bouquet-fence-gift-give-1549224/#content ・画像は選択とマスクで切り抜き ・文字をアウトライン化して一時的に不透明度を50%にして花に入り込ませたい箇所を消しゴムツールで消しました。 以上。 お手本のバナーを頂いている

          今日のバナー模写#76

          今日のバナー模写#75

          下が参考バナー 上が模写して制作したバナー 所要時間:50分 ↓参考サイト デザインの気づき&メモ ・ネオンが楽しそうだったのでサイトを参考に挑戦したが、細かいところでうまく制御できなかった。かなり難しい。 ・文字だけillustratorで作ってからPhotoshopで光と影の加工。それぞれ得意分野を使う。 ・やはり手本は、よく見れば見るほどネオンの反射や陰影による立体感など細かい描写が丁寧だ。プロとアマチュアの違いを垣間見た。またリベンジしたい。 以上。

          今日のバナー模写#75

          今日のバナー模写#74

          右が参考バナー 左が模写して制作したバナー 所要時間:20分 デザインの気づき&メモ ・ドットパターンを復習したくて選択。パターンを作るときは背景を透明にするのがコツ。 ・新しいアートボードで以下のようにドットを配置し、新規パターンを登録→長方形ツールを作りレイヤースタイル→パターングラデーションで作ったパターンを選択し、比率調整。 多分これでもいける↓ このバナーの存在自体は発光色により目立っているが、「セール」ということ以外に情報が分かりにくい。なので検索エン

          今日のバナー模写#74

          今日のバナー模写#73

          左が参考バナーで右が模写して制作したバナー 所要時間:30分 デザインの気づき&メモ ▼ノイズなし ▼ノイズあり ・ノイズによって、昔のフィルム写真のイメージ、人の優しさ、あたたかさが生まれた印象。 ・一方、テキストや斜めのシェイプで、スピード感、躍動を感じ、スポーツらしさ良いバランスが取れている?? 以上。 お手本のバナーを頂いているサイト https://retrobanner.net/ http://banner.keizine.net/ htt

          今日のバナー模写#73

          今日のバナー模写#72

          左が参考バナー 右が模写して制作したバナー 所要時間:20分 デザインの気づき&メモ ・要素が少ないときは周りに色枠を作ってボリュームを作る ・「TIMESALE」と「70%」が強調されている ・左右は中央だが上下は以外と若干下の方が中央に見える 以上。 お手本のバナーを頂いているサイト https://retrobanner.net/ http://banner.keizine.net/ https://bannnner.com/ http://banne

          今日のバナー模写#72

          今日のバナー模写#71

          右が参考バナー 左が模写して制作したバナー 所要時間:40分 デザインの気づき&メモ ・若者向けのバナーは基本可読性よりおしゃれ感重視の印象。 ・図形に沿わせて文字配置は楽しい。 以上。 お手本のバナーを頂いているサイト https://retrobanner.net/ http://banner.keizine.net/ https://bannnner.com/ http://bannermatome.com/ https://rdbnr.jp/bann

          今日のバナー模写#71

          今日のバナー模写#70

          左が参考バナー 右が模写して制作したバナー 所要時間:15分 デザインの気づき&メモ ・まずは70個突破したことが嬉しい。 ・シンプルであしらいが少なかったから比較的早く完成した。 ・文字をはみ出すくらいに大きくしてインパクト。斜めにして躍動感。 ・SALEのあしらいはドロップシャドウ×2 ・先に水平に全体を作ってからまとめて最後に全選択Ctrl+Tで変形させることで角度をすべて同じに保って変形できる。 以上。 お手本のバナーを頂いているサイト 日々の積み

          今日のバナー模写#70

          今日のバナー模写#69

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

          今日のバナー模写#69

          今日のバナー模写#68

          左が参考バナー 右が模写して制作したバナー 所要時間:60分 デザインの気づき&メモ ・フォントの種類は3種類で太さも複数種あり、それを正方形のシェイプに整理して詰め込むことでおしゃれな印象。 ・似た写真素材と似たフォントを探すのに苦労した。 ・真ん中のあしらいは「エレガントフレーム 素材」で調べると色々あります。 以上。 お手本のバナーを頂いているサイト https://retrobanner.net/ http://banner.keizine.net

          今日のバナー模写#68

          今日のバナー模写#67

          右が参考バナー 左が模写して制作したバナー 所要時間:60分 デザインの気づき&メモ ・いびきだから夜寝る時のイメージカラー青 ・横向き枕専用なのに上むいている。使い方まちがっとるやん。根本のところやん。 ・いびきの悪いイメージを背景のもやもやのパターンで表現。 ・無料素材の迷彩柄を青くして配置。 以上。 お手本のバナーを頂いているサイト https://retrobanner.net/ http://banner.keizine.net/ https:/

          今日のバナー模写#67

          今日のバナー模写#66

          左が参考バナー 右が模写して制作したバナー 所要時間:40分 デザインの気づき&メモ ・下の白い背景は長方形ツールをフィルターぼかし ・光の線は二種類の多角形ツールを活用。これもフィルターぼかし ・ベッドから影が離れている割に濃い 以上。 お手本のバナーを頂いているサイト https://retrobanner.net/ http://banner.keizine.net/ https://bannnner.com/ http://bannermatome

          今日のバナー模写#66