.../articles/

デザイナーとして忘れちゃいけないポイント

僕は名刺にはデザイナーと書いてあります。「には」っていうと含みがありますが、デザイン作業ではないことも同時にいろいろ行うという意味です。その中で、デザインと向かい合うときに忘れないようにしたいことをメモしておきます。

デザイン以外の作業というと、例えばマークアップ、画面設計書の制作、コーディングガイドラインの整備、プロジェクトのスケジューリングとか、さまざまなこと(これはスタッフみんな一緒なんですが)を同時に行っています。

プロジェクト全体を常に見ようとすると些末なデザインの差異はだんだんどっちでも良くなっていってしまうんですよね。プロダクトのデザイン的な強度より、プロジェクト全体に影響する効果が欲しくなってくる。
それでも忘れないようにしたいなーということの自分用のメモです。

アクションにできないと目標や自分の中の基準としてうまくワークしなそうなので、そこも書いておこう。


1. すべての意図を言語化する

「なんとなく」、「それっぽいから」をなくす。意味がないものはデザインしない。スタイリングとして必要な意匠も「なぜ必要か」、「どういう印象を与えるものなのか」(まず自分の中で)言語化しよう。

TODO : デザイン作業を行う度にデザインデータに意図を書き込むようにしよう。
TODO : このポイントたちを案件ごとにまとめてコメントするようにしよう。

2. 時間を確保する

当たり前なんだけど難しい。プロジェクトの中でどれくらいのリソースをデザインにかけるべきで、どれくらいの再現度をマークアップに求めるか、とか。デザインシステムの設計をどれくらいの細かさで行うか、それをどれくらいコンポーネント設計に反映するか、とか。手癖でできてしまいそうな部分こそ、きちっと時間を確保してデザインしよう。

TODO : スケジュール上の「デザイン」の工数を明確に出す。その上で作業時間をメモしよう。

3. 新しいUIをつくる

スマートフォン向けのウェブサービス、アプリのUIもかなり成熟して来ている中で、まったく見たことのないものを作るのは無駄ですよ、もしくは「車輪の再発明」ですよ、とよく言われます。まったくもって正しいけど、それを鵜呑みにしてしまっては「それっぽさ」の塊をつくることになってしまいます。組み合わせでも再発明でも良いので最適なUIをつくり、その“最適”という基準を常にアップデートしよう。

TODO : デザインのどこがキモになるのかデータに残しておくことにしよう。

4. 時間軸を考える

ステータス、モーション、ロードなど、時間が関わる見えない部分も考える。デザインカンプとしての網羅性を上げて、成り行きでつくることが無いようにしよう。

TODO : hover, disable, touched, loading, vacantはデザインデータに必ず入れよう。

5. 構図的な良さにこだわる

ウェブサービスをつくることが多い、ということを見た目の構図的な良さを放棄することの言い訳にしない。見て美しいと思う画面をこだわってつくる。その感覚を捨てないようにしよう。

TODO : 構図的なリファレンスを探すようにしよう。
TODO : 要素同士の構図的な関係性をスケッチしよう。

6. 強い工夫、アイディンティティを持たせる

“強い工夫”って感覚的なんですが、応用が効いて自立している工夫、という感じでしょうか。それはアイディンティティにつながっていきます。どれだけ消費されるものにも、小さくて良いのでアイディンティティを持たせよう。

TODO : まず意図をデザインデータにメモしよう。その上でどう達成されたか評価しよう。


マークアップも含めてやることが多いので、あとで考えればいいやー、という細かい部分が出てきてしまいそうになるのを詰め切る心の強さが欲しいところです。
Figmaとかのテンプレートにこういったこと入れておくとより良いかも。

.../articles/

Articles

記事

AWS AmplifyにmonorepoのNext.js(App Router)をデプロイする

AWS AmplifyにmonorepoのNext.js(App Router)をデプロイする

monorepo管理しているNext.jsをAmplifyにデプロイしようとした際にいくつか躓く内容があったのでまとめておきます。

リモートワーク・オンライン会議でも、スムーズに制作を進めるために大切なこと[資料編]

リモートワーク・オンライン会議でも、スムーズに制作を進めるために大切なこと[資料編]

コロナ禍の影響により、リモートワークの導入をおこなっている制作会社も多く、実際に弊社でも導入しています。

売れるECサイトデザインを作るために。参考にしたいおしゃれな事例の探し方。

売れるECサイトデザインを作るために。参考にしたいおしゃれな事例の探し方。

売れるECサイトのデザインは、「この形式」という決まりはありません。ECサイトで売り上げを上げるなら、しっかりとしたコンセプトと、コンセプトを決定するまでのリサーチが必要です。

制作会社の考える、業務効率化ツールのおすすめ。個人でも使いやすいサービスなど。

制作会社の考える、業務効率化ツールのおすすめ。個人でも使いやすいサービスなど。

新型コロナウイルス感染拡大の影響で、リモートワークが主流になり、弊社でも週のほとんどは各自宅で作業をしています。

Figmaでデザインのコミット履歴を残せるプラグイン【Thought Recorder】をリリースしました

Figmaでデザインのコミット履歴を残せるプラグイン【Thought Recorder】をリリースしました

Figmaを利用するWebデザイナーの助けになれると嬉しいです。使い方は本記事をご覧ください。

ECの構築方法、おすすめのECサービス。

ECの構築方法、おすすめのECサービス。

ファッションや家電、スーパーの買い物でさえもECサイトを利用することが当たり前になりました。加えて新型コロナウイルスの影響もあり、弊社にも「どんなプラットフォームを利用したら良いか」「どれくらいコストがかかるのか」などECに関するさまざまなご相談を頂きます。

FastAPIのスキーマクラスをOpenAPIから生成する方法

FastAPIのスキーマクラスをOpenAPIから生成する方法

PythonでAPIを構築する要件があり、フレームワークに比較的モダンなFastAPIを採用しました。FastAPIはバックエンドの開発を行えば自動でOepnApi定義を生成する機能が備わっていますが、今回はこれを使わず、事前に用意したOepnApi定義からFastAPIで利用するスキーマクラスを生成する方法を紹介します。

Laravel 日本一解りやすい全文検索のマイグレーション記載方法解説

Laravel 日本一解りやすい全文検索のマイグレーション記載方法解説

Laravel + MySQLで全文検索を実装する

とあるPythonのソースで sys.path.append としたく無かった話

とあるPythonのソースで sys.path.append としたく無かった話

とあるプロジェクトのとあるソースコードのレビューをしてた時、「ソースコードの参照がうまくいってなかったので修正しました」とレビュー依頼がきました。 ディレクトリ構造 ``` module L __init__.py L main.py L tests L __init__.py L test_main.py ``` ソースコード ``` python tests/test_main.py sys.path.append(os.path.abspath("..")) from main import fuga ``` 今まで案件でPythonに触れる機会も結構ありましたが、なんとなく使ってきた部分も多く、この書き方が良いのか悪いのか判別できなかったので、改めてPythonのモジュールのインポートに関して調べてみたのでブログにしました。普段PHPを書いている事が多くPythonに関して何も分からないので初心者向けの内容になっていると思います。

GiFT1号目新卒デザイナーの2021年振り返り

GiFT1号目新卒デザイナーの2021年振り返り

いつの間に、年末ですね。入社してもう、9ヶ月も立っていたようです。2021年の振り返りを記事にしました。

すべての記事

お問い合わせ