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