社内で参加者を募り、ハンズオン形式の勉強会(オンライン)を実施。 開催までの準備や当日の進め方、実施してみた感想などをまとめました。 開催フロー1.告知 ・勉強会の内…
Step.1 タブメニューを作成してコンポーネント化 (command + K) ↓ Step.2 初期設定のステートの「+」を押して 「新規ステート」を追加 ↓ Step.3 「プロトタイプ」…
1.余白について 余白とは ・空間的に何もない部分 ・要素間の領域 ・白でなくてもOK 余白をとる目的 ・情報同士の干渉を防ぐ ・情報を明確にする ・ユーザー心理、導線を…
〜要素間のアキを調べる〜 Step.1 パーツを選択。 ↓ Step.2 パーツを選択した状態でアキを調べたい要素にカーソルを合わせ、Optionキーを押す。 ↓ Complete! 要素同…
スタックを設定し、各パーツの間隔を一定に保つ。 Step.1 各パーツを作成し、コンポーネントに変換。 (command + K) もしくは、グループ化だけでもOK。 ↓ Step.2 マ…
パディングを設定し、文字数に応じて横幅を可変させるボタンを作る。 Step.1 ボタンを作成し、コンポーネントに変換。 (command + K) ↓ Step.2 マスターコンポーネ…
3D変形+アニメーションでタップした要素を横に1回転 Step.1 アニメーション前と後のアートボードを用意(コピペでOK) ↓ Step.2 プロパティインスペクター(右側)の変形…
クリエイターのための総合情報サイト「CREATIVE VILLAGE」にデザイナー向けのコラムを寄稿しました。 デザイナーの必須アイテムはやはりデザインツール。 ただ、そのツー…
ooooo
2020年11月2日 23:08
社内で参加者を募り、ハンズオン形式の勉強会(オンライン)を実施。開催までの準備や当日の進め方、実施してみた感想などをまとめました。開催フロー1.告知・勉強会の内容や日時、エントリーフォームのURLを知らせる告知文を作成・社内で使用しているコミュニケーションツールや告知専用サイトに投稿使用ツール:Google Forms、Currents、Google sites↓↓↓2.連絡用
2021年2月14日 17:23
Step.1タブメニューを作成してコンポーネント化(command + K)↓Step.2初期設定のステートの「+」を押して「新規ステート」を追加↓Step.3「プロトタイプ」に切替え、ボタンの移動先を追加したステートに設定する↓Step.4「プロトタイプ」に切替え、タブの移動先を追加したステートに設定する[インタラクション]・トリガー:タップ・アクショ
2020年11月15日 19:02
1.余白について余白とは・空間的に何もない部分・要素間の領域・白でなくてもOK余白をとる目的・情報同士の干渉を防ぐ・情報を明確にする・ユーザー心理、導線を操作する余白をうまく使うことで、美しいレイアウト、見やすさ、要素のバランスなどの「見ための印象」と、導線、操作性、わかりやすさなど「ユーザーを操作」することができ、ユーザーにストレスと混乱を与えないデザインにすることができ
2020年11月14日 21:27
〜要素間のアキを調べる〜Step.1パーツを選択。↓Step.2パーツを選択した状態でアキを調べたい要素にカーソルを合わせ、Optionキーを押す。↓Complete!要素同士のアキの数値(px)が表示される。Optionキーだけ押した場合は、ボードに対しての上下左右のアキが表示される。以外に便利な時短テク。
2020年11月3日 20:27
スタックを設定し、各パーツの間隔を一定に保つ。Step.1各パーツを作成し、コンポーネントに変換。(command + K)もしくは、グループ化だけでもOK。↓Step.2マスターコンポーネントを選択した状態で、プロパティインスペクター(右側)の「スタック」にチェックを入れて有効化。↓Step.3垂直方向 or 水平方向を選択し、任意の間隔の値(px)を入力。↓
2020年11月3日 19:33
パディングを設定し、文字数に応じて横幅を可変させるボタンを作る。Step.1ボタンを作成し、コンポーネントに変換。(command + K)↓Step.2マスターコンポーネントを選択した状態で、プロパティインスペクター(右側)の「パディング」にチェックを入れて有効化。↓Step.3任意のパディング値(px)を入力。↓完成複製したコンポーネントの文字を変更。
2020年11月2日 00:31
3D変形+アニメーションでタップした要素を横に1回転Step.1アニメーション前と後のアートボードを用意(コピペでOK)↓Step.2プロパティインスペクター(右側)の変形にあるキューブ型のアイコンを選択、3D変形を有効化。↓Step.3X軸、Y軸、Z軸の回転を加える↓Step.4プロトタイプモードに切り替え、・トリガー:タップ・アクションの種類:自動アニメー
2020年11月2日 00:09
クリエイターのための総合情報サイト「CREATIVE VILLAGE」にデザイナー向けのコラムを寄稿しました。デザイナーの必須アイテムはやはりデザインツール。ただ、そのツールを使うのではなく「活かす」こと。活かし方次第でデザイナーとしての強みとチームに欠かせない存在になっていきます。それをどうやって実現していくか。↓↓↓----------株式会社メンバーズ メンバーズキャリア