.../articles/

情報設計とデザインの間

デザインする上で必要な情報にはどのようなものがあるのか考えてみます。

デザインをする上で必要な情報

デザインをする上で必要な情報ってなんでしょうか?

  • 原稿
  • 素材(写真とか)

がまずは思い浮かぶところです。
どちらもレイアウトを考える上でのピースとなるようなもので、
なければ正確なデザインをつくることはできません。

必要な情報にはいくつか種類があると思っていて、

  • 一次的な情報 : そのまま表示される情報(原稿、メディア、ボタンなどの機能など)
  • 二次的な情報 : デザイン時に考慮に入れる情報(ターゲット、サイトの目的など)

多少乱暴ですが一時的な情報と二次的な情報に分けることができます。
少なくとも一時的な情報は揃っていてほしい、というのがデザイナーとしての希望ではあります。

どんな情報が入ってきてもうまくハマるシステムを作るのが良いデザインシステムではありますが、すべての事象に対応できるデザインなのであればそもそもそれはスクラッチで用意する必要はありません。

要望に合わせたデザインを考えるためにも一時的な情報までは揃えたいです。


どこまでやるのがデザインか

少し深堀りすると、ウェブサイトやウェブサービスを構成している要素にはどのようなものがあるのか、という話になってきます。

『IAシンキング Web制作者・担当者のためのIA思考術』という著書に以下の有名な図が掲載されています。

いろいろなテキストに引用されていて、別のソースからですがこの記事(「見ているものを知るための知識」)にも使いました。

Webサイト構築に必要なプロセス 原題 : Element of User Experience ※この図は筆者が書き起こしたもの

この図でいう「戦略」「要求」の層までは、必要な情報として揃っているべきです。
機能仕様やコンテンツ要求はワイヤーフレームなどにまとまっているとデザインに反映しやすく良いと思います。

「戦略」だけ与えられ、「要求」の部分までデザインで行おうとすると、UI要素の抜け漏れや、機能として組み込む際に考慮すべきステータスなどが抜けてしまったりしてしまいます。
要求もテキストの箇条書きだけではイメージしているものが分からないことが多く、そういう意味でワイヤーフレームの重要さが理解できると思います。


デザインは0から1をつくるようなイメージを持たれてしまうこともありますが、
周到に準備されたものからできるデザインと、そうでないものでは品質や後工程に影響があります。

…まぁ、全部できるに越したことないんですけどね。
有限のリソースをどのように使うかは良いものをつくる上で大切な観点だと思います。

.../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年の振り返りを記事にしました。

すべての記事

お問い合わせ