Figma Web & UI Design Book

Feature

本書の特徴

初心者のための基本操作から、実際にFigmaを利用したサイト・アプリのデザイン制作のながれ、チームでFigmaを活用する方法について学べる一冊です。

ダウンロードできるデザイン作例は4つ。架空のポートフォリオサイト、ホテル運営企業のコーポレートサイト、インテリア EC サイト、料理レシピアプリの3つのWeb サイトと1つのアプリケーションをご用意しています。

また、デザインの制作体験ができる章を用意しており、「Figma を操作してデザインを覚える」ことができるのが本書の特徴となっています。

2022年7月29日にリリースされたFigmaの日本語化に対応した日本初の書籍となっています。操作画面および解説も日本語化に対応しているため、これからFigmaをはじめる方も安心して取り組める内容となっています。

Editing, Writing

Figmaのいいところを見て知って、使って、触って楽しめる4章構成

本書はFigmaをはじめて使う方に向けた第1章の準備編からはじまり、実際に手を動かしてFigmaの機能を学ぶ第2章 実践編、3つのデザイン作例を通して制作のながれやFigmaの使い方をより深める第3章 応用編、チームでの活用やペアデザインについて学べる第4章 活用編で構成されています。

書籍の構成を検討する際、「どうすればFigmaのいいところを押さえながら、はじめての人でも実用レベルで使えるようになるか？」を著者一同で考え、上記の章立てを作成しました。また、すでにFigmaを使っている方にも楽しんでいいただける、役に立つ一冊になるよう、デザイン会社ならではの「デザイン作例」をご用意することにしました。さらに弊社の知見を盛り込んだ「チームでのFigma活用」「ペアデザイン」についても収録し、neccoだから出せる本を作りました。

はじめての編集、執筆には苦労も（たくさん）ありましたが、出版社さんのサポートもお受けしながら、最初から最後まで著者4人、全力で走りきりました。

Design

カバーや図版・販促ツールまで、書籍にまつわるデザインをFigmaで制作

書籍カバーデザインの案だし、書籍内に掲載している図解画像、書店用の販促POPなど書籍のビジュアル制作にまつわる工程の多くをFigmaでおこないました。また、書籍制作では編集者さん、DTPデザイナーさんともFigmaを通して一緒に紙面構成や原稿フィードバックを おこなっています。

Figmaの特徴である共同編集機能を活用してチームでコミュニケーションをとりながら、書籍から販促ツールまで世界観が統一されたデザイン・販促展開を目指しました。

Supportsite Design / Development

Tailwind UI Templates を利用して公式サポートサイトを実装

書籍に掲載されている作例のデザインのアクセスするための公式サポートサイトです。Tailwind UI のTemplatesをベースに Next.js + Tailwind + Vercel にて実装しています。

Client Voice

neccoさんがしてくれたのは執筆ではなく、問題解決でした

信頼する方からの紹介で、今回の書籍の執筆を依頼しました。どんなチームなのか緊張したneccoさんとの初回の打ち合わせは、信じられないほど楽しい時間でした。書籍の構成立てでは、ハンズオン型の書籍が抱える多くの問題を解決いただきました。構成が固まって、アップデートし続けるサービスを追いかけながら原稿を書きあげていただき、やっと出口が見えたと思ったところで日本語化対応の発表。1カ月に満たない期間で日本語化対応をして書籍が発行できたことは、今でも信じられません。

お祭りのような時間でしたが、最後まで楽しく書籍づくりができたのはこのチームだったからです。多くの問題解決に取り組んでいただき、ありがとうございました！

株式会社マイナビ出版
畠山 龍次