デザイン(Figma) 【デザイン】キャラクターデザインは丸による単純化が大事。洋ナシ型・ピーナツ型・マッシュルーム型 いきもののキャラクターデザインをするときは、引き算する描き方が大事。すっきりと削ぎ落としたシンプルな形から、かわいらしさが生まれる。写真などの資料は見過ぎないようにする。囚われ過ぎてしまい、本来のいきものの特徴を捉えにくくなるから。頭身比率は、基本は1:1.5くらい。 2024.02.03 2024.07.02 デザイン(Figma)開発・デザイン
デザイン(Figma) 【キャラクターデザイン】売れるキャラクターのデザインは左右非対称? キティちゃんって、実は左右非対称なんですよね。以前に「売れるキャラクター戦略」という本を読んだことがあって、その本に書いてありました。参考になると思いますのでお時間ある際に読んでみてくださいというアドバイスを受けて、下重心で左右非対称にデザインを変更してみた。 2023.11.19 2024.07.01 デザイン(Figma)開発・デザイン
デザイン(Figma) 【ChatGPT × Figma】html.to.designとGPTで、編集可能なモックアップを作成。手書きも可能? ChatGPTのプロンプトで、Bootstrap風のHTMLファイルを作成してローカル環境で表示。Figmaのプラグイン「html.to.design」を活用してHTMLファイルから修正可能な状態でモックアップとしてFigmaに取り込むことができる。 2023.10.25 2024.07.01 デザイン(Figma)開発・デザイン
デザイン(Figma) 【Figma】コメントノートを使ったら、画面が見やすくなりステータス管理しやすくなった Figmaのコメント機能はバルーンのポップアップ表示なので一覧性に乏しい。Figmaのコメントノートは、コメントの一覧性を保ちながら、タイムスタンプやステータス管理もできるシンプルかつ優れた機能。また、コメントのデザインも可愛くて使いやすい。 2023.11.27 2024.07.01 デザイン(Figma)開発・デザイン
デザイン(Figma) 【UIデザインの教科書】UI/UXの違い・階層と構造・割り込み・スクロールとページング UXと比較すれば、UIの扱う範囲は狭いが、UXの中でも最も大事な「使う」という領域を担っている。UIが担う部分はUXの中核。階層は、深く狭くより広く浅く。広く浅い方が目的の情報に辿り着きやすく、ラベル(カテゴリ)名を具体的、排他的に決めやすい。 2024.01.06 2024.07.01 デザイン(Figma)開発・デザイン
デザイン(Figma) 【デザイン】アイコンガイドラインの作成と統一法:Font Awesome, Material Icons, React Icons クロスプラットフォーム(Web・アプリ)で開発している場合に、歴史的経緯やリソースの優先順位などからアイコンガイドラインが定まっていない場合がある。有名なアイコンフォントとして、Font AwesomeやMaterial Fontsなどが挙げられる。 2024.04.30 2024.07.01 デザイン(Figma)開発・デザイン
デザイン(Figma) 【Figma】オートレイアウトで、アイコン非表示の際にズレないようにする方法 Figmaのオートレイアウトは、要素間の距離を自動的に調整し、デザインの一貫性を保ちながら柔軟にレイアウトを管理できる機能。ナビゲーションバーのデザインにおいてアイコンを非表示にするとタイトルが中央からずれる問題とその解決方法について解説。 2024.04.21 2024.07.01 デザイン(Figma)開発・デザイン
デザイン(Figma) 【アプリ】iOSスクリーンショット用のグリッド投稿をFigmaで作成 iPhoneスクリーンショットは、全てのiPhoneのディスプレイサイズで画像を用意する必要はなく、アプリの UI が複数のデバイス サイズとローカリゼーションで同じである場合は、必要な最高解像度のスクリーンショットを提供するだけで良い。 2024.05.13 2024.07.01 デザイン(Figma)開発・デザイン