今日のアイキャッチの写真は去年のお正月にポートタワーへ初日の出を見に行った時に撮影した写真です。
1限目：プロトタイプのフロー設定について
2限目：共有機能について
3限目~5限目：成績考査
今日教わったこと
・XDには初期テンプレがある。Webは幅1280が主流で他は1920が多い。XDに1366もあるけどあまり使わない。
・カスタムはWとHを指定してクリックすれば起動する
・スクロールは「垂直」に。なしにするとプレビューで全体図が出てきてしまい、スクロールしたらどう見えるかが確認できない
・ビューポートの高さはレビューの時の画面表示高さなので650がおすすめ
（ファーストビューを確認する）
・グリッドでガイド線出せるので好きに使う
・プロトタイプモード：ここをクリックしたらこう推移しますよ、こう動きますよをデザインできる
・共有：作られたデータをメンバー間で共有できる。
・モバイルプレビュー：PCに直でスマホをつなぐとそのスマホ上でデザイン確認できる
・ライブラリ（左下）：よく使うパーツ（ラジオボタンなど）を共有しつつ保存できる
・レイヤー（左下）：Adobeソフトなのでレイヤーがある
・プラグイン（左下）：プラグインをダウンロードしたり使用したりできる。
・図形描画はフォトショやイラレと基本一緒
・アートボードの線の横にカーソルを当てて◀|▶が出たらガイド線を引ける
・四角の角の指定順などはWeb準拠になってる
・色指定の画面の+を押すと今指定している色をストックできる
・ペンツールはイラレと同じ仕様
・テキストで書体を選ぶ時にイラレやフォトショみたいにプレビューが無い
・「ここにURLを挿入」というところにURLを入れればプレビューで遷移先込みで見れる
・XDはレイヤーでというよりグループで管理する感じ
・クリッピングマスクは図形に対してドロップするだけなのでめちゃくちゃ楽だけど、図形の線を外さないと線が残るので注意
・XDはwebp未対応かも。Win10のXDはダメだったのでWin11で要確認
・この範囲に文字入れるよをしたいならテキスト選択した状態で長押しして描画してから書く
・リピートグリッド：同じものをまた作りたい時に、1つめを先に作ってからリピートグリッドを選択した状態で緑のバーを横や下に動かせばコピーした状態で並べられる。その時に間隔を調整したいならピンクのやつを動かして調整できる。
ただ、画像をそのままクリッピングマスクしようとすると全部の部分に同じ画像が入ってしまうのでグループ解除してから1つずつやるか、複数画像を入れたい番号順に連番にした状態で複数選択してドロップすれば順番で入っていく（たまにうまくいかない）
文字でもテキストファイルを使って同じように一斉変更ができるが、改行で次に切り替わる仕様なのであまりお勧めできない
・レイヤーの順番にも気を付ける。固定を使ったときに変な潜り込み方をする
・お仕事ではPC、スマホ版の画面や推移先の画面をアートボード並べて作ることが多い。それをプロトタイプで見る
・クリックして矢印が出てきたらそれを掴んで遷移先に当てるとリンク先の設定ができて、インタラクションの欄で細かい設定ができる。ヘッダー固定しているならY-オフセットを設定しないとページ内リンク先が隠れちゃうので注意
・デスクトッププレビューはデザインモードに戻さないと見れないので注意
・別ページへ遷移するなら種類を「トランディション」にする
・ハンバーガーメニューを作るなら別のアートボードを作ったうえで種類は「オーバーレイ」
・XD上でクリッピングマスクした画像をそのまま使いたいなら「アセットを書き出し」
・全景を書き出すのは営業資料やポートフォリオ使うように書き出す
・XDはトライアルサイトおすすめ
・codejump：コーディングの練習にお勧め
コメント