講義の感想や講義中に困った点などの体験談をご紹介しています。
※ただしネタバレは無しです。詳しくはデイトラを受講されてください！
筆者のデイトラ学習方法
【内】モニターで動画を視聴しながら、ノートPCをモニタに繋いでデザイン（作業）
【内】のほうが作業効率は高いです！
デュアルモニターでの作業は非常におすすめです。
1万円台からでも購入できます。
パソコンも学習開始を機に、勉強用に購入はいかがですか？
DAY1 概要説明
「ECクリエイティブコースとはこんなことを学びます」という説明でした。
その中でも、なぜマーケティングが必要なのかも説明があり、とても勉強になりました。
後半は、講義で使うアプリケーションのインストール作業を行いました。
DAY2 Figmaの準備
ECクリエイティブコースでは、デザインの制作をFigmaというツールで行います。
無料で使えるので経済的です。
ただ英語なので、日本語化の対応(処理)をする必要があります。
同じ機能をもったツールにAdobeXDがありますが、お高いです。
Figmaとはどんなツールなのか解説があり、アカウント登録～日本語化までの作業を実施します。
DAY3 売れるデザインについて
ECクリエイティブコースでは、ECの商品ページをメインに作ります。
そのため、良い商品ページとは何かの解説がここでは説明があります。
講義の終了後、課題として実際にページを見て学習します。
筆者は楽天市場を学習しました！
ECクリエイティブコース制作編「DAY 3 成果の出る制作物とは？」をクリアしました。
商品ページの研究してみました(楽天市場)
見方を変えると学ぶこと多い・・・今日はここまでで、明日からはFigmaの勉強です🙂#デイトラ #ECクリエイティブ #webデザイン #今日の積み上げ pic.twitter.com/ei3OGTCf2z
— ふらんぶ🌿@サービスデザイナん【再修業ー勉強中】 (@dayantler) April 2, 2022
DAY4 Figmaの基本操作 part1
まずはアカウント登録作業をします。
その後、日本語化するChrome拡張機能をインストールして、利用準備完了です。
画面構成について、何をどこから生成するのかを学びました。
DAY5 Figmaの基本操作 part2
図形の作り方、色付けなど基本操作を学びました。
DAY4と併せて進められる量でした。
DAY6 Figmaの基本操作 part3
コンポーネント化について学びました。
コンポーネント化しておけば、マスタの色を変えたら全てが変わる、マスタでないものを変えても他に影響しないという便利な機能です。
・ヘッダー
・フッター
・メニュー
・ボタン
などで使えます。
さらに、オートレイアウト機能を学びました。
AdobeXDではおなじみですが、Excelで画面ラフ作成をする人にとってこの機能は神機能です。
DAY7 Figmaで簡単なバナー作成（トレース）
実際に作業をする回でした。
AdobeXDを使っていても、Figmaはまだまだ使い始めたばかり・・・
完成したものはひどい出来でした笑
おまけにWeb上で使っているため、タイムラグがあって配置のズレが起きました。
Figmaの使い方学びました🙂
XDに似てるなと思いつつも、Web上で動かすとちょっとラグがある…
バナーはPsのほうが作りやすい😂ECクリエイティブコース制作編「DAY 7 Figmaを使って簡単なバナーを作成してみよう」をクリアしました。 #デイトラ #ECクリエイティブ #webデザイン #今日の積み上げ
— ふらんぶ@ECクリエイティブとマーケ (@dayantler) April 4, 2022
このあとアプリをダウンロードして、web版を使うのを止めました！
結果、タイムラグが無くなり快適に使えるようになりました。
早く日本語版が欲しい・・・
あと、筆者はWindowsを使っていたので、フォントについても弊害がありました。。。
Windowsだと「ヒラギノ」が使えないのでトレースが大変😂
Figmaはフォント選択がXDより手間だな😭
ヒラギノ明朝は、游明朝かBIZ UD明朝で対応してみた🙂
完全に再現はできないけど…やっぱMac勢が多いのかな？#Webデザイン勉強中 #デイトラ #今日の積み上げ #駆け出しwebデザイナーと繋がりたい
— ふらんぶ@ECクリエイティブとマーケ (@dayantler) April 6, 2022
さいごに
次回から、商品ページ画像のトレース（DAY8~DAY14）に入ります。
