.../articles/

見ているものを知るための知識

“デザイン”を見る時、なにを見ているかということについて少し考えました。自分が見ているものがどういうものなのか、それを知るのは面白いな、みたいな話です。

デザインを考える時、よくPinterestやギャラリーサイトでリファレンスを探すのですが、他の人に見せたときに、自分が見てたポイントじゃないところを気にかけられることってよくあります。

色、イラスト・写真などのモチーフ(描かれて/写っているもの)、賑やかさ、みたいなポイントへのつっこみが多いとよく思います。「わかってないなー」という話ではなく、 「見えているもの」は同じなのに「見ているもの」が違う のは面白いな、という話です。

個人的には、上記のポイントは調整可能なものとして捉えることが多いです。リクエストに合わせて変えればいいかな、くらいに思っています。(関係ないけど極端に賑やかにするのは苦手です)


……ここで「エスキモー※は雪をあらわす52の呼び名をもっていた」みたいな話あったよなと思い出し、 ものの名前や現象、仕組みを知っていることで自分が見るものの解像度って変えることができるよね、それが面白いなと思うんすわ 的な話にしようと思ったんだけど、調べたらこれ別に本当に呼び分けてたわけじゃないみたいです。なにを信じたら良いのかわからん。調べるって大事ね。

エスキモーの雪の名前は何種類?【隙間リサーチ】 | ちりつもFILE (β

※ちなみに現在はエスキモーではなくイヌイットと表現するのが良いようです。
覚えていて検索したのがこの単語だったのでそう書いています。

↑この記事の最後の方の、

日本語では「雪」以外に「雪を指す言葉」はありませんが、「空から降ってくる水」を、その状態に応じて「雨」「霙」「雪」「雹」「霰」と呼び分けています。雪だけしか降らない地域や、雨だけしか降らない地域では、おそらくこのような複数の語幹での呼び分けは定着しないでしょう。

ここの部分はたしかにー!と思いました。日本語にも細かい呼び分けありましたね。

知っていればそれらを見分けることができ、知らなければそれらは同じものに見えるということは、 「見ている解像度が変わっている」 ってことなのかなと思います。


無理やり話を戻しますが、僕がデザインを見るときはまず始めに情報構造とスタイリングとコンテンツに分解します。

  • 情報構造   : 装飾的な要素を排除した文脈や文章構造
  • スタイリング : 余白、色、文字、図など見た目を装飾する部分
  • コンテンツ  : 中身、モチーフ。なにを見せているものなのか

コンテンツに適した情報構造なのか、情報構造に適したスタイリングなのか、みたいな分解をします。

装飾的な部分を見つけ出すことは見た目通りですが、情報構造はすこし慣れや知識が必要なのかもしれません。そのデザインをワイヤーフレームに戻したらどうなるか、とか、マークダウンで書いたらどうなるか、みたいに考えて見ていることが多いです。

これも大本の出典※がどれか見つからないのですが、 「ユーザー・エクスペリエンスのダイアグラム」 のような構造を分解して解説してくれている先人の知恵を拝借すると、より理解が進みます。

第1回 ユーザー・エクスペリエンスって何だ? | 日経 xTECH(クロステック)

引用:第1回 ユーザー・エクスペリエンスって何だ? | 日経 xTECH(クロステック) のキャプチャ

※ この「UX を構成する 5 つの段階を振り返る | UX TIMES」によると、『ウェブ戦略としての「ユーザーエクスペリエンス」』という著書に書かれているみたいです。ごめんなさい買って確かめてはないです。


ものを見た瞬間の、自分の感覚を信じることは大事だと思います。
同時に、なにを見てしまっているのかを疑い、さまざまな知識で解像度を補強していくことも大事かなと思います。

ウェブコンテンツをデザインするのは、「機能と情緒」「知識と感覚」みたいな相反しそうに見えるものが同居しているのが難しく、面白いところだと思います。

.../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で全文検索を実装する

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

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

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

TimesclaeDBのデータ圧縮に関して

TimesclaeDBのデータ圧縮に関して

TimescaleDBはデータベース内の一部のテーブルを時系列データとして扱えるPostgreSQLの拡張です。PostgreSQLの機能拡張なので非常に手軽に導入できます。今回はこのTimesaceDBの圧縮について調べたので備忘録として書き綴りました。

すべての記事

お問い合わせ