技術 ブログ

読書メモ:Figma for UIデザイン




メインでコントリビューションしているethereum.orgや、web3系のさまざまなオープンソースプロジェクトも使われているデザインシステムであるFigmaですが、具体的にこのアプリで何ができるのか(どのような機能があるのか)実はよく分かっていませんでした。

そのため、この本を購入してベーシックな機能を学習することにしました。

FigmaはWeb系やアプリの画面デザインを中心に行うツールということで、全体的にフルカラーのスクリーンショットで文章よりも画像で理解をさせる構成になっています。

中盤以降は、インスタグラムみたいな画面を設計しながら体感的に理解しながら進めていく内容になっています。

Figmaを使うメリットとしては、実際のアプリに近い形で効率的に画面のデザインすることができるということです。

また、Figmaは、Mac、Windowsのインストールアプリで使えるだけでなく、ブラウザでも同じようにフル機能をクロスプラットフォーム+Webで無料で利用可能です。

それだけでもすごいですが、多人数で同時に作業をしながらデザインを考えることができるコラボレーション機能が強みだとわかりました。

OSSは場所を超えて作業するので、このような素晴らしいコラボレーション型のデザインシステムが無料でフル機で利用できるというのがOSSでも人気を得た理由でしょう。

しかし、基本的には、Figmaで考えたデザインを基にCSSや色を出力し、HTML実装はプログラマやWebデザイナーがしなければならないようです。

有償のアドオン等を追加すれば自動でHTML等もある程度出力してくれるものもあるようです。

カラフルな書籍でFigmaのベーシックな機能を使ったUIデザイン方法を把握できるので、おすすめの書籍です。

コメント投稿フォーム

メールアドレスが公開されることはありません。 が付いている欄は必須項目です