タグ

ブックマーク / www.ar-ch.org (8)

  • デザイン時に気を付けたい目的と手段の取り違え

    デザインする時、手段ばかり追ってしまい、「( ゚д゚)ハッ!そもそもの目的ってなんだっけ」ってなりがちなので、気を付けたいなと思いまとめてみました。 1. 目的をしっかりと認識する 例えば、上のようなボタンをデザインしたとき、「もっと目立つように大きく、色も赤とか目立つ色にしてください」という修正指示を受けたとします。 「目立たせる」という目的の解決策として、「大きくする」、「赤などの目立つ色を使う」という2つが考えられています。そしていつの間にか、これらの解決索が目的にすり替わっていることが無いでしょうか。 「大きくする」、「赤などの目立つ色を使う」ことを行えば目的を達成できるかのように錯覚するのですが、その解決策は当に最適かを考える必要があります。そもそもの目的は「ボタンを目立たせること」で、その解決策は他にもあります。 2. 他の手段も考える 「目立たせる」ためには、差別化する、近

    デザイン時に気を付けたい目的と手段の取り違え
  • Webサイト制作の一連の流れをまとめてみました

    Webサイト制作の一連の流れをまとめてみました。クライアント向けにまとめたものを少し手直ししてのせています。新人Web担当者さんや、新人ディレクターさんの参考になるかなと。 なるべく難しい言葉を使わず、理解しやすいよう平易な言葉で書いております。 ※流れや手順は制作会社によって違うのですが、概要はつかめるかなと思います。 目次と流れ 1. サイトのコンセプトを考える 2. 競合他社からクライアントのお店や商品を選んでもらうためのポイント(強み)を整理する 3. そのサイトで一番伝えたい内容を決める 4. お客さんが必要とする3以外の情報や、クライアントの伝えたい情報をまとめる 5. サイト更新は誰がするのかを決める 6. 想定使用デバイス(PCやスマートフォンなど)を決める 7. サイトの周知・宣伝方法を考える 8. ページの設計図をつくる 9. サイト制作にかかわる必要な素材を準備する

    Webサイト制作の一連の流れをまとめてみました
  • アイコンの役割や使い方をおさらいする

    リニューアル後のGmail、そのアイコンの意図がわかりづらくて、使いづらいなーと思ってました。 なので、どうしてわかりづらいのか、とか、アイコンの意図が読めないとどうなるのかを考え、またアイコンって重要だなと再認識したので忘れないようにエントリです。 そもそも、アイコンの役割とは? そもそものアイコンの役割とは、機能などを絵(グラフィック)におきかえて、わかりやすく示すことです。 ただ、絵というのは、意味の伝達が多義的になります。 それが大きな利点でもあるのですが、機能を示すために使うときは、意味が一義的になるようにする必要があります。 ユーザーを混乱させないようにする ユーザーがアイコンから意味をうまく読み取れないとき、迷って時間がかかってしまったり、最悪使うこと自体をやめてしまうかもしれません。 そのような機会損失を防ぐために、アイコンの使い方を考えたり、意味の明瞭なアイコンを作成する

    アイコンの役割や使い方をおさらいする
  • レイアウトの基本的な型と、レイアウトからデザインまでの流れ

    Webサイトにおいて、レイアウトの基的な型と、レイアウトからデザインまでの流れを簡単にまとめてみました。 レイアウトからデザインまでの流れを把握しておくと、その間の思考が分断されずデザインがしやすくなると思います。 また、ユニークなレイアウトにするにしても、あらかじめ基的な型を知っておくと逸脱がしやすくなりますね。 レイアウトに影響を与える要因 レイアウトにはいくつかの型がありますが、まずその型を決定する前に、レイアウトに影響を与える要因を知っておく必要があります。これらの要因によって、レイアウトの型があらかじめ決まったり、レイアウトが大きく変わるからです。 情報階層の深さ →1ページのサイトなのか、第二階層以降ありグローバルナビゲーションが必要になるのか、など サイトの目的・属性 →そのサイトでは何を伝えたいのか。企業・ブランドのメッセージや情報、ユーザーに役立つ知識(Wikiped

    レイアウトの基本的な型と、レイアウトからデザインまでの流れ
  • フォントの基本的な選び方

    フォントの基的な選び方を、備忘録的にまとめてみました。 フォントをどう選んだら良いのかわからない、もしくは選ぶのに時間がかかるという初心者さん向けです。 フォントには、それぞれ書体によって特徴があり、ユーザーに与えたい印象によって書体を選ぶ必要があります。 (それに縛られすぎてもいけませんが…(あえてインパクトを出すために違う印象のフォントを組み合わせたりする)、基的な選び方として知っておくと良いと思います。) 私は以下の順番でフォントを選んでいます。 恐らく他のデザイナーさんも、この順番だと思います。 1. フォントの系統選び 2. 選んだ系統から、さらに書体を選ぶ 3. 書体のウェイトを決める 4. 字間の調整 さらに具体的な手順を1つずつ説明していきます。 1. フォントの系統選び 日では、和文フォントと欧文フォントの2つを使います。 また、和文フォントは、以下の4つに大きく分

    フォントの基本的な選び方
  • Webデザインの評価項目をつくる

    Webデザインの評価項目というのを、ディレクターやデザイナーの方々はつくっているでしょうか? 評価項目があると、デザイナーやディレクターだけでなく、クライアントにとってもデザインの基準がわかりやすくなり、目標地点が明確になります。 今までつくったことがなかったという方は、この機会につくってみてはどうでしょうか。 改めて、Webデザインの評価項目をつくるメリットです。 デザイナー、ディレクター、クライアントにとって、デザインを評価する共通認識を持つことができ、三者間で認識のブレが少なくなる デザインの優先すべき項目(もっと企業の色を出したい、など)がわかりやすくなり、それをデザインに反映させることができる デザイナーは、すでに満たされている要素にそれ以上時間をかけることがなくなり、足りない要素に注力できる デザインの評価項目とデザインエレメント一覧表 私はWebデザインの評価項目を、以下のよ

    Webデザインの評価項目をつくる
  • デザイン上級者 21の特徴

    デザイン上級者は、中級者と初心者と何が違うんだろう?って思った時に、こちらのが役に立ちました。 『上達の法則 – 効率のよい努力を科学する –』というです。このには、碁や茶道など、あらゆる分野に共通する上級者の特徴がのっています。このを参考に、デザイン上級者の特徴と、上級者になるための実践方法を書いてみました。 デザイン上級者の特徴 1. 上級者は一つのデザインから読み取ることが多い 一つのデザインを見たとき、上級者の方が中級者、初級者よりも気づくことが多いです。例えば、背景に薄くグラデーションがかかっているとか、縦のグリッドのラインが揃っているなど。 また、そのデザインからたくさんの情報を引き出しているので、長く見ても退屈しにくいという特徴を持っています。 2. 上手なデザインをするということに高い価値をおいている 上級者は、デザインに対して気で取り組む度合いが高いため、上手な

    デザイン上級者 21の特徴
  • カード型のグリッドデザインについての考察

    2010年あたりから流行しているカード型のグリッドデザインですが、まだまだこのレイアウトが多く見かけられますね。 しかし、内容と見せ方が合っていないサイトもしばしば…。 というわけで、このデザインの長所や短所、使いどころについてまとめてみました。 長所 一度にたくさんの情報を見せることができる。 整然と並んでいるため、堅実でしっかりとした印象を与えることができる。 同じ形や似た形のものが多く並んでいるので、インパクトが大きく、記憶に残りやすい。 興味を引くきっかけがたくさんあり、第二階層へ入ってもらいやすい。 短所 初心者ユーザーは一度に与えられる情報量が多くなり、とまどう可能性がある。 興味のあった情報から一度離れて、再度そのサイトを訪れたとき、どこに情報があったのか見つけにくい。 同じサイズのボックスが並んでいると、情報階層が同等に見えるため、情報に明確な順位差をつけるのが難しい。 (

    カード型のグリッドデザインについての考察
    futomo
    futomo 2011/09/06
    レイアウトについて
  • 1