タグ

WEBデザイン理論に関するkiyokichiのブックマーク (20)

  • Web制作会社に飛び込んだ新入社員にとりあえず読ませたいスライド

    Webデザインのセオリーを学ぼう / Webデザインのウソ・ホント ~ Web らしく... / コンテンツで改善する UI デザインの極意他...全21件

    Web制作会社に飛び込んだ新入社員にとりあえず読ませたいスライド
  • それじゃあ何も伝わらない!元ディレクターがデザイナーになって気付いた、デザイン依頼で注意すべき4つのこと : LINE Corporation ディレクターブログ

    ネッツアイに火の用心 あなたのハートにG-SHOCK!こんにちは、nakatanigoです。 かつてはディレクターブログを書く立場だったのですが、諸事情により遠ざかっておりました。 というのも、かつて前職でデザイナーをしていた経験から、ディレクターを2年ほど経験した後、デザイナーに転籍したのです。 そこで、今回はその経験から、ディレクターからデザイナーにデザインを依頼する際に注意すべきことをお話させていただきます。ディレクターがデザイナーに依頼をする際、こういう言い方は避けたほうがいいという事例もあわせてご紹介します。 大前提として、デザイナーはディレクターから言われたことしかやらないわけではありませんので、依頼に疑問があれば質問し相談します。しっかりとコミュニケーションをとれば下記のような事例は起こらないと思いますが、それが抜けてしまった場合には効果の小さいデサインができあがってしまうと

    それじゃあ何も伝わらない!元ディレクターがデザイナーになって気付いた、デザイン依頼で注意すべき4つのこと : LINE Corporation ディレクターブログ
  • 新人デザイナーに教えたいWebデザインの基本原則【整列】

    以前私は、デザインの勉強を一切したことの無いデザイナー志望の新入社員に、webデザインを教える教育係を任されたことがあります。 教育なんて簡単なんじゃないの?と安易に考えた私は、案の定痛い目を見たわけです。この日から1ヶ月間、私は毎日3時間残業する羽目になってしまいました。 人に教えるのは意外と難しく、何から教えたら良いのかすらわかりませんでした。ただやはり最初なんで基が大事だろうと思い、先輩達のアドバイスを受けながら、【デザインの基原則】を教えることになったわけです! 今まさに新人教育に困っている人がいれば、まずこの記事を読んでもらって見てください!新人デザイナーに教える手間が1.2時間はぶけるかもしれません!(記事がわかりにくければ読ませないでください。その時はごめんなさい) では、早速題に入りたいと思いますが、まずは私が新人デザイナーに初めに教えることにした【レイアウトデザイン

    新人デザイナーに教えたいWebデザインの基本原則【整列】
  • デザインの要素と原則

    2017年6月29日 Webデザイン 今回はデザインの基礎をお勉強しましょう!デザインは複数の要素(エレメント)と原則(プリンシプル)から成り立っています。それらを簡単に説明するとともに、要素と原則を生かしたWebサイトを一諸に紹介します。私は「デザインセンスは才能」とは考えていません。デザインセンスはそれらの要素をどう組み合わせるか、という閃きとその引き出しの多さによるものだと思います。ぜひ参考にしてみてください! ↑私が10年以上利用している会計ソフト! デザインの要素(エレメント)と原則(プリンシプル)は全てのビジュアルデザインの基礎と言われています。要素はデザインの「表現手段」を形成し、原則は「構造的特徴」を構成します。デザインにおける要素と原則の認識は、視覚構成をすることにおいての最初のステップ。Webデザイン、グラフィックデザイン、プロダクトデザインなど、すべてのビジュアルデザ

    デザインの要素と原則
  • 実用的なユーザビリティの10のポイント:ガイドライン編 | コリス

    ユーザーにあなたのウェブページを容易で、そして楽しくアクセスできるようにする実用的なユーザビリティの10のポイント(ガイドライン編)をSmashing Magazineから紹介します。 Tumblr 多くのフォームは2カラムのレイアウトを採用し、ラベルはフィールドの左に配置されています。一見よさそうに思えますが、これは採用すべきではありません。 なぜなら、フォームは一般に垂直に方向付けがされているためです。ユーザーが左→右→左下と視線を動かすことより、上→下と移動する方が容易です。 また、ラベルを左に配置することはもう一つの問題があります。 あなたはラベルを右揃えと左揃えのどちらで配置しますか? 左揃えはラベルを読みやすくしますが、どのフィールドのラベルか判断するのが難しい場合があります。 右揃えはその逆です。フィールドのラベルを判断するのは容易ですが、ラベルを俯瞰するのが困難です。 2.

    kiyokichi
    kiyokichi 2009/10/01
     「ナビゲーションやボタンなど広告のように見えてしまうエレメントに注意してください」 あるかも・・・。
  • http://gerenuk.crazyphoto.org/2009/06/25/873/

    kiyokichi
    kiyokichi 2009/06/26
     デザインはおもいやりでできていると言っても過言ではないのかも。
  • IDEA * IDEA

    ドットインストール代表のライフハックブログ

    IDEA * IDEA
    kiyokichi
    kiyokichi 2009/05/22
     「小さな文字はよく読まれる」など、意外な項目も。@2009年5月
  • 「サイトの横幅」再論:950px時代のウェブデザイン[絵文録ことのは]2009/01/14

    以前、サイトの横幅を640ピクセルにする理由――統計と現状に基づく結論[絵文録ことのは]2006/11/25で、「実際にサイトを閲覧している人のブラウザーの横幅と、ブラウザーによる印刷上の制約から、特に画像は左端から640ピクセルくらいに収まるようにした方がよさそうだ」という結論に落ち着いた。これには、一行字数が多すぎると読みづらい、という、紙媒体の扱いも多いわたしの経験的な見方もある。 もちろん、これにはリキッドデザイン主義者の方から「ページ幅を指定するようなデザインであること自体が悪」という反応があったり、「印刷用CSSを使おう」といった反応があったりしたのだが、「印刷時のことを考えれば640pxという制約がある」という結論は特に揺るがなかった。 その後、今まで約2年経った。閲覧者の環境も変わり、当時主流だったIE6にはなかった「用紙サイズに合わせて印刷」機能を備えたIE7ユーザーも増

    kiyokichi
    kiyokichi 2009/01/15
     2009年度のはじめにおけるコンテナ横幅について
  • ウェブサイトの第一印象を決める大切な21のポイント

    ウェブサイトの第一印象を決める大切な21のポイントをVandelay Website Designから紹介します。 21 Factors that Influence the First Impression of Your Website's Visitors 下記は、それを簡潔にした意訳です。 ロード時間 ロード時間はユーザーをいらいらさせる大きな要因です。少しでも早くロードするように設計をします。 エラーメッセージ エラーメッセージが表示されアクセスができないと、ユーザーは二度とアクセスをしないでしょう。 カラー サイトのデザインは第一印象の重要なファクターです。正しいカラーコンビネーションを使用して、効果的で適切なカラースキームを使用します。 ロゴ もう一つ重要なファクターはロゴです。ブランディングを考慮し、信頼感を与えるロゴを使用します。 ヘッダ ヘッダも強い印象を与えます。魅力

    kiyokichi
    kiyokichi 2009/01/09
     まあ当然な列挙
  • SLOBSERVER - L'actualité de Second Life

    App development is certainly an exciting but challenging process. Several factors are involved in developing an app, due to which the final cost to develop an app greatly varies from project to project. It is important to be familiar with the entire process of creating a comprehensive app development budget because it is common for developers, especially new programmers, to exceed the budget while

    SLOBSERVER - L'actualité de Second Life
    kiyokichi
    kiyokichi 2008/07/09
     文字変更ボタンは無意味
  • 第7回 コンテンツの魅力を引き出すユーザーフレンドリーなウェブライティングのコツ | Web担当者Forum

    第7回 コンテンツの魅力を引き出す ユーザーフレンドリーなウェブライティングのコツ 現実の店舗や窓口では、目の前にいるお客が困っていればすぐにわかるし、同じトラブルが重なれば問題がおきないように施策をとる。しかし、ウェブサイトを作っているときにはお客は目の前にいないし、公開後にお客の対応をするのはウェブサーバーやスクリプトという機械だ。そのため、現実の商売では当然のように行っている接客ができない、いや忘れてしまってはいないだろうか? 今木 智隆(株式会社ビービット) コンテンツの価値を確実に伝える ウェブライティングの基6大原則とは「Content is King」という言い回しを見聞きしたことはあるだろうか? これは“音やグラフィックなどの表現法より、提供する情報の中味がまず第一である”という格言であり、ビル・ゲイツも引用しているほどだ。最近は、SEOやLPOを筆頭とするさまざまな「ノ

    第7回 コンテンツの魅力を引き出すユーザーフレンドリーなウェブライティングのコツ | Web担当者Forum
  • OKボタンの位置はどこが適切?

    弊社業務状況のご案内 2020年7月から弊社はフレックスタイム制による毎日の出社勤務体制としていますが、状況により在宅勤務体制に変更する場合もあります。 なお、オフィスは宅配便や郵便物等の受け取りは可能です(10:00〜17:00)。 Pickup2020/04/05 Windows WPF用カラーモード編集ツールのリリース 話題のダークモードアプリ開発に向けたツールを開発しています。 ダークモードに関するデザイン情報を含めてのご案内です。 開く

    kiyokichi
    kiyokichi 2008/06/11
     *ボタンの配置 OSによる差
  • Webデザインに黄金比を取り入れよう - Re:Creator’s Kansai

    PR 「おすすめのレンタルサーバーランキングが知りたい」「人気のレンタルサーバーを比較したい」という方に向けて、2024年3月最新の人気レンタルサーバーのおすすめ9社をランキング形式で紹介します。 当記事ランキング1位のレンタルサーバーがキャンペーン中! シン・レンタルサーバーがキャンペーン実施中!(2024/5/20まで) 実質385円~「利用料金50%キャッシュバックキャンペーン」 出典:シン・レンタルサーバー公式サイト シン・レンタルサーバーでは、2024年5月20日(月)まで月額利用料金が実質半額になるキャンペーンを開催中です。 ベーシックプランの36ヶ月契約なら、「13,860円」キャッシュバックで、なんと実質「385円/月」で利用できます。

    kiyokichi
    kiyokichi 2008/06/06
     *理論 黄金比 1:1.618
  • 覚えておくと便利なバランスのよい縦横比とバナーサイズ :: Love & Design ::

    この記事へのトラックバック ウェブデザインにも、「黄金比」「白銀比」 Excerpt: 覚えておくと便利なバランスのよい縦横比とバナーサイズ :: Love & Design :: 黄金比や白銀比の縦横比や色々なバナーサイズの紹介。 美しいモノは��... Weblog: 日々、ウェブデザインとネットニュースとゲームとか。 Tracked: 2008-04-25 23:55 バランスのよい若草? Excerpt: 縦横比……。 ずっと以前から、 タテとヨコの比率によって、美しく見える割合が研究されてきました。 覚えておくと便利なバランスのよい縦横比とバナーサイズ Love & Design 白銀比、.. Weblog: ウェブライター流転記(改訂版) Tracked: 2008-05-12 21:44 覚えておくと便利なバランスのよい縦横比とバナーサイズ :: Love & De

    覚えておくと便利なバランスのよい縦横比とバナーサイズ :: Love & Design ::
    kiyokichi
    kiyokichi 2008/04/24
     *WEBデザイン 比率 バナーサイズ
  • 第13回 Webページで読みやすいテキストとは:ITpro

    今回のポイント 1行あたりの文字数の目安 1段落の文字数の目安 段落に含む文字数 行間調整の考え方 字間調整を使ったロゴ風味見出し 日語というのはもともと縦書き文化です。文字も筆で縦書きしていくときに書きやすいように作られています。現在PC画面上で見るフォントは,活字印刷物のフォントとは違い,横書きで読みやすいようにもともとの字体から若干形を変えられています。それでも起源である縦書きの形を完全に壊すことができないので,やはり横書きでは読みづらいようになっています。 日人が苦痛を感じることなく読める横書き1行あたりの字数は20字+α程度だと言われています。意識して雑誌などを見るとたいていが!)25文字から28文字程度です。用紙,つまりのサイズがA4を超えるような大判になると,1ページを左右2段組に分けて25~28字程度に調整されています。 一方,縦書きの場合には識別許容量はグンと増加し

    第13回 Webページで読みやすいテキストとは:ITpro
    kiyokichi
    kiyokichi 2008/03/21
     *WEBコンテンツ 読みやすさ ユーザビリティ
  • 長い文章は読まないという嘘。コンテンツを読ませるちょっとしたコツ | Web担当者Forum

    コンテンツは現場にあふれている。会議室で話し合うより職人を呼べ。営業マンと話をさせろ。Web 2.0だ、CGMだ、Ajaxだと騒いでいるのは「インターネット業界」だけ。中小企業の「商売用」ホームページにはそれ以前にもっともっと大切なものがある。企業ホームページの最初の一歩がわからずにボタンを掛け違えているWeb担当者に心得を授ける実践現場主義コラム。 宮脇 睦(有限会社アズモード) 心得其の四十五 ホームページでもっとも必要な力近頃は動画共有サイトにセカンドライフのような仮想CG空間と「映像系」が花盛りです。ちょっと前までポッドキャストが「次世代」と呼ばれ喧伝されていました。ITゲーム業界の「次世代型」や「新世代」は、世界陸上を中継する織田裕二さんの「この後すぐ」位の信頼性です。 動画共有サイトは、映画会社や制作会社のように「映像」をすでにもっている会社にとってはあらたな「チャネル」とし

    長い文章は読まないという嘘。コンテンツを読ませるちょっとしたコツ | Web担当者Forum
    kiyokichi
    kiyokichi 2007/11/22
     テキストの配置の仕方、ページャーの使い方など
  • caraldo.net - it転職 リソースおよび情報

    caraldo.net は、あなたがお探しの情報の全ての最新かつ最適なソースです。一般トピックからここから検索できる内容は、caraldo.netが全てとなります。あなたがお探しの内容が見つかることを願っています!

    kiyokichi
    kiyokichi 2007/10/30
     動線とか
  • 人の目を引くクリエイティブ(ビジュアル基本編) : LINE Corporation ディレクターブログ

    こんにちは。livedoor でディレクターをしている有賀です。 今日のお題は、「人の目を引くクリエイティブ(ビジュアル基編)」についてです。 前回の「ライティング編」でお話ししたように、私たちは日夜“一瞬で理解できるモノ作り”を試行錯誤しているわけですが、それとツートップとなるのが前回お話した「コピー(文字)」と、今回お話しする「ビジュアル(視覚表現)」です。 多くのユーザーは、ウェブページを見てから数秒で「見るべきものかどうか」を判断するというシビアなご時世。その数秒のほとんどは、実は、ビジュアルの印象で占められているのではないかと思います。 私もユーザーとしてサイトを見た場合、ページを開いてから一瞬で目にする構造(レイアウト)や色、形や動きなど、文字を読む前にインプットされる情報によって、多くの判断をしていることに気が付きます。 今回は、そんな「ビジュアル」についての概念を簡単にお

    人の目を引くクリエイティブ(ビジュアル基本編) : LINE Corporation ディレクターブログ
    kiyokichi
    kiyokichi 2007/09/13
     *WEB *理論 デザイン
  • 小学生のためのWebサイトづくり | Junnama Online

    Webに関する様々な書籍や雑誌記事、Web上でのノウハウが公開されているけれども、子供たちに向けたWebコンテンツを企画し、制作する際のノウハウは中々見当たらない。 先日、「子供にとってのWebアクセシビリティ」って企画があって僕自身も参加したのだが、消化不良なところがあって、ならば、いそのことWebサイトをつくる現場で、子供たちの声を聞きながら作ってみよう、という試みを行っている途中。 Web上のリソースとして「Alertbox : ティーンエージャーのためのウェブサイト・ユーザビリティ」があるけれど、サイトを作る目的、日固有の問題とかを意識しだすと、必ずしもマッチしないところが出てくるので、僕が感じたこと、現場でおこっていることをまとめてみようと思う。 今回の企画は、中央官公庁のつくる、教育・学習を目的としたコンテンツである。小学生が自宅でパソコンをつかってWebを利用することは「あ

    小学生のためのWebサイトづくり | Junnama Online
    kiyokichi
    kiyokichi 2007/09/11
     ユーザビリティ こども
  • ウノウラボ Unoh Labs: 「視線を導く」方法あれこれ

    yamazakiです。毎度毎度技術系なこのウノウラボには馴染まない話題を振りまいているわけですが、さてはてどの程度お役に立てているものか…。 今回のテーマは「視線」です。例えばWebサイトは「見てもらう」ことが大事ですし、また、UI設計の場面などでも、「視線をうまく導いてやる」のは使い勝手をよくする上でも大切なことだと思います。といったわけで、ユーザの視線をうまく捕まえてみたり導いてみたりする上で役に立つかもしれない情報を簡単にまとめてみます。 1.視線をつかまえる Web上にも街にも広告だの何だのと情報が氾濫しています。その中で「見てもらう」ためには何かしらの工夫が必要になることがあります。というわけでまずは「人の視線をつかまえる」ための方法論を少し。 「人の顔」を使う まずはこの画像を見てみてください。 01 posted by (C)フォト蔵 最初に、どれを「見てしまいました」か?

    kiyokichi
    kiyokichi 2007/09/10
     *デザイン 視線 ユーザー動線
  • 1