サイトデザインをする上で、デザインがワンパターンになったり、煮詰まったりすると思います。そんな時、Instagram を使わない手はありません世界中のインスピレーション溢れるアート系の発信やデザイン系のイメージがたくさん参照できます本記事ではデザインのヒントになること間違いなしの海外のアートデザイン系の Instagram アカウントをご紹介します。
Bootstrapの見慣れた感というか、モック感から脱却しようとFoundationとかに手を出しかけてたのですが、Googleがだしてきたマテリアルデザインキットがすごく良かったので紹介します。 たとえば管理画面風のデザインはこれ ほかにもBootstrap風の上部メニューのデザイン（Android）もあったり コンポーネントと呼ばれる部品も充実しています。これ見るだけで色々できそうな気がしますね！ Blog風など幾つか提供されています。いまとあるサイドプロジェクトで簡易的な管理画面をつくろうとしてたのですが、早速活用していい感じに仕上げることが出来ました。 ダウンロードすると全テンプレートが含まれているので、コピペで組み合わせるだけでも結構いい感じに出来ます。Bootstrapに飽きてきたら、ぜひ使ってみてください。 www.getmdl.io
Photo by Marcy Leigh こんにちは。谷口です。 現在、Webデザイナーとして働いている皆様はどんな書籍を読んでいますか？ 最近は、基礎的なデザインの勉強をしてきた方だけでなく、もともとITエンジニアとしてWebサービスの開発をする中で、Webデザインもすることになったという方も多くいらっしゃるかと思います。 今回は、Webデザインの仕事をしている方々が、デザインをするに当たってジャンルごとに役立つ書籍を17冊ご紹介いたします。 目次 ・IA、UI、UX ・レイアウト ・配色 ・HTML/CSS ・CMS組込み ・デザイン技法 ■IA、UI、UX ◆1.IAシンキング Web制作者・担当者のためのIA思考術 IAシンキング Web制作者・担当者のためのIA思考術 作者: 坂本貴史,宮崎綾子,長谷川恭久出版社/メーカー: ワークスコーポレーション発売日: 2011/03/29
スマートフォン対応させるWebサイトが急増しています。しかし、スクリーンが小さくタッチ操作がメインのスマートフォンでは、デスクトップ向けWebサイトのデザインで培ったノウハウの多くが通用しません。このような時代におけるスタンダードなデザインルールを学ぶために、弊社デザイナーの荒砂を中心に、Appleが公開しているiOS Human Interface Guidelineと、Googleが公開しているMaterial Design Guidelineの比較を行いました。（以降、両者をガイドラインと略します） スマートフォン向けのWebサイトのデザインを考える上で、アプリのUIデザインの定石を知ることは重要です。なぜなら、スマートフォンにおいてはWebサイトをブラウズする機会は14％しかなく（comScore調査／2014）、多くの時間をアプリの中で過ごしているためです。さらにユーザは「これは
あなたのブランドを魅力的に見せるアイキャッチ画像は、非常に大切です。どんなカラーパレットを使うか、どんなタイプのイメージを選ぶか、どんなフォントが一緒に機能するか、デザインのプロセスは多岐に渡ります。 Webページやブログのヘッダ、プロダクトの打ち出し、ブランドのメッセージなど、見た人の印象に残るアイキャッチ画像の作り方、50の作例とデザインする際に役立つアドバイスを紹介します。 Steal These 50 Branding Kits For Your Startup 下記は各ポイントを意訳したものです。 元記事ではアイキャッチ画像と同テイストの名刺も同時に紹介されています。 ※当ブログでの翻訳記事は、元サイト様に許可を得て翻訳しています。 Whimsical: サンプル画像 抑えられたトーンとミニマルなタイポグラフィ 画像にソフトなカラーフィルタを使いトーンを抑え目にし、タイポグラフィ
文字の扱い方、レイアウト、カラー、エフェクトなど、プロのデザイナーがこだわっているデザインの基本となるルールと、ついやってしまう間違いとその解決方法まで、ワンランク上のデザイナーになるためにひとつ一つをしっかり見直したい20のデザインテクニックを紹介します。 カーニングとはフォントの文字間のスペースを調整することです。カーニングの最終目的は、それぞれの文字の間が不自然な空白にならないように字面間のスペースを均等にし、テキストを美しく整然とした一つのまとまりにデザインします。 カーニングがされていない、カーニングがいいかげんな仕事は、デザインの世界において大罪の一つです。カーニングはデザイナーが早い段階で身につけるべき重要なスキルです。 20 Typography Mistakes Every Beginner Makes 基本的だけど大切なタイポグラフィのシンプルな14のルール リーダビリ
現役女子大生が「ウェアラブルデバイス」（身に着けられるデジタル端末）のデザインを行い、そのお披露目会が3月17日に東京・渋谷で行われました。この企画は、リクルートテクノロジーズの研究開発機関「Advanced Technology Lab」とのコラボレーションにより実現したもの。イベントには実際にデザインの開発に携わった現役女子大生9人が登場し、自分が担当したデバイスのデザインへの思いをそれぞれに語りました。 始めに登場したのは「スパイラル型ブレスレット」。先端にピンクゴールドとラインストーンをあしらいました。ラインストーンのサイズも、1つ1つ違うサイズにといったこだわりようです。 続いては「タイル型バングル」。これは配色に特にこだわったデザインで、このバングルを着けたまま海や山に行っても違和感のない色を選んだとのことです。カラーはグリーン・ブルー・オレンジの3種類。 「ファーブレスレット
今週のお題「これって私だけ？」 すでに解決した話なんですが、勘違いしてたお話。 東横線に乗ったことがある人なら見たことがあるであろう、あの露出が激しいクマ。 妻とそれを見ながら、 私「このクマさー露出激しいよね」 妻「そだね」 私「それにかなりグロいよね」 妻「そう？」 私「スパッと切れてるじゃん」 妻「え？」 私「え？」 勘違いしていたのは私だけでしょうか……。これだけインパクトがあれば注意するよなぁ、と。 ちなみにこのクマは、カルビーボテトチップスのじゃがいも君やミスタードーナツのキャラクターを手がけていた原田治さんがデザインしたものだそうです。 カルビー ポテトチップスコンソメパンチ 60g×12袋 出版社/メーカー: カルビー発売日: 2012/11/19メディア: 食品&飲料この商品を含むブログを見る そんなことをなぜ知ってるかというと、はてなダイアリーで原田治さんご自身がこんな
最近受けた仕事で、イベントのチラシのデザイン制作があったのですが、載せる文章などの情報量が多く、整理するのに苦戦しました…。 なんとか形にして第1稿をあげたものの、ごちゃごちゃして分かりづらい紙面となり、ほぼやり直し…。 チラシ制作とか何度もやってるはずなのですが、情報を整理して分かりやすくまとめるのってホント大変だな…と改めて感じ、見返す機会になったので、情報を分かりやすく整理する方法、視覚的に分かりやすくするポイントなど、基本的なことで思い当たったものをまとめて、実際の情報整理の流れを書いてみました。 分かってるつもりでも、なかなか実践できてなくて困ってしまうま。 個人の経験と考え方でまとめたものなので、何か間違っていたらすみません…。 まずは情報を分類する まず、伝えたいことをそれぞれパートに分けます。 今回はイベントのチラシを想定します。こんな感じでしょうか。 ・タイトル（大見出し
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
