ニュースの理解が深まるタイムツリーコンセプト
リアルタイム時代に必要なニュースUI 新聞サイト・ニュースサイトは、基本的に「記事」という情報の単位をもつことを前提にしています。そして、記事という単位を時系列やテーマ（カテゴリ）別で表示できるように CMS でコントールしています。こうした見せ方は情報サイト全般で扱われていますが、今のニュースのスピードや Web 利用の変化と照らし合わせると、記事という情報単位があまりにも大きく柔軟性が乏しく感じることがあります。現在のニュースサイトのコンテンツに起こっている現象が幾つかあります。 速報ですら記事にしないといけないので、200文字程度のページが存在する 記事というタイトルとテキストを必要とする『入れ物』があるため、テキストだけ、ビデオだけ、写真だけといったコンテンツタイプの格納がしにくい ソーシャルメディアでブレイクしたニュースに追いつけない ニュースサイトのリアルタイムと、人が体感する
Microsoft Learn: Build skills that open doors in your career
Microsoft Learn. Spark possibility. Build skills that open doors. See all you can do with documentation, hands-on training, and certifications to help you get the most from Microsoft products. Learn by doing Gain the skills you can apply to everyday situations through hands-on training personalized to your needs, at your own pace or with our global network of learning partners. Take training Find
18 Cool Redesign Ideas for Popular Websites
Design plays a pivotal role in the success of a website, acting as the crown to the content’s kingship. It’s not just about looks; design shapes how we interact with content. A poor design can lead to a frustrating user experience and a decline in website traffic. As web designers, we often face a balancing act. In our pursuit of creating the perfect website, we find ourselves weighing aesthetics
[JS]文字を楽しく見せる、カーブ状に簡単に配置できるスクリプト -Arctext.js
Demo 4: Set/animate 「Animate me」でアニメーション。 Arctext.jsの使い方 Arctext.jsは「Lettering.js」をベースに文字をパスに沿わせて正しく回転させ配置します。 Lettering.jsについては、下記を参考ください。 HTMLファイルを汚さずに細かい設定でspanを挿入できるスクリプト -Lettering.JS では、Arctext.jsの使い方を。 外部ファイル 「jquery.js」と当スクリプトを外部ファイルとして記述します。 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script type="text/javascript" src="js
TRUCK FURNITURE
TRUCK furniture is made right here in our workshop in Osaka, Japan.
iPadならではの特徴的なユーザ行動について (ユーザビリティ実践メモ)
iPadのようなタブレット型のタッチＵＩ端末では、PCでは見られなかった特徴的なユーザ行動が見受けられます。今回は、弊社の調査で見られたiPadにおける特徴的なユーザ行動と、デザイン上のポイントについてご紹介します。 【ポイント１】 ユーザはスクロールが苦ではない 弊社のユーザ調査にて、iPadで画面が切り替わる度にスクロールしてみようと画面をドラッグするユーザがよく見受けられました。ユーザは画面をスクロールしたがる傾向があるようです。 確かにiPad上で画面をスクロールすると、指に吸い付くようにスムーズに画面が動くため、直感的で心地よい感じがします。iPad上での快適なインタラクションは、ユーザにとってポジティブなフィードバックを与え、スクロールも苦になりにくいと考えられます。 情報は極力たくさん並べよう 調査で用いたショッピング用のアプリでは、iPadの縦１画面内におさまるだけの商品し
Webデザイナーが文字組版を勉強するときに参考になるサイト
「Webデザイナーのためのタイポグラフィと文字組... / Webデザイナー（私）によるタイポグラフィーレイ... / Illustratorで文章を扱うとき（文字組版...他...全9件
2read.jp - このウェブサイトは販売用です！ - まとめ ランキング 読書 ログイン 書籍 著者 小説 マンガ リソースおよび情報
このウェブサイトは販売用です！ 2read.jp は、あなたがお探しの情報の全ての最新かつ最適なソースです。一般トピックからここから検索できる内容は、2read.jpが全てとなります。あなたがお探しの内容が見つかることを願っています！
iPad GUI PSD - Version 2 | Teehan+Lax
Now in its second iteration, this version of the template has been completely redesigned from the ground up. Based on the recent 4.2.1 update, it includes all the elements you need to design proof-of-concepts or production ready assets. The last version of this file was riddled with issues like blurry edged buttons and incorrect “bevels”. These issues have been addressed as best they can using Pho
アートディレクターとデザイナーの違いって。
エッセイ・デザイナーのつぶやき アートディレクターとデザイナー、DTPの違いって。 アートディレクションとは？グラフィックデザイナーとは？ アートディレクターとグラフィックデザイナー、エディトリアルデザイナーや、DTPの違いを誤解されている方が多く、はっきりさせておかねばならないと思った事が何度かある。 DTP (Desktop publishing、デスクトップパブリッシング)とは、日本語で卓上出版という意味である。 「DTPオペレーター」というのは本来は「コンピューターで紙面の割り付け」をする者の事で、デザインが出来る人の事を表すのではない。 これはコンピューターが台頭するまでは「版下」とよばれた部署である。 グラフィックデザイナーの「グラフィック」の意味とは、「図形」「形」の意味。 元々は平面印刷の総称から始まった、情報やメッセージを伝達する手段として制作された媒体の
変形 - Akiba Hideki
今回は、「設計変更」が発生したときの設計者とクライアント間のコミュニケーションを考慮しました。 あなたは、あなたのために仕事を注文するクライアントやディレクターとどのような意識を持っていますか？ たとえば、少し大規模なシステム開発の場合、「このように動くものを作る」と言った直後にプログラムを作成する開発者などはいないようです。 実際、システム開発の予算の大部分は非常に重要であるため、「設計（要件定義を含む）」に充てられています。 つまり、この「設計」フローがなければ、手を動かすことで作業することはできません（大まかに言えば）。 一般的なデザイナーの仕事には大きな懸念があります。 つまり、「要件を設計および定義するためのフローなしで設計を行う設計者が多すぎます」。 現在、特にWeb制作では、「デザイナーと開発者」は異なる次元の人種のように切り離されていますが、それは本当ですか？ 私はデザイナ
【実録】アプリアイコンの作り方 〜２％のデザイン〜
気温がコロコロ変わり上着を来たり脱いだり忙しい今日この頃、 みなさんいかがお過ごしでしょうか？ 相変わらずご無沙汰しております(^〜^;) Jacminikです。 またまた、僕がデザインさせて頂いたアイコンがAppStoreに並びました！ パチパチパチ〜♫ …ってなワケで、 今回はとあるiPadアプリのリニューアルアイコン制作の過程を紹介させて頂きながら、アプリのアイコンがユーザーの目に留まるようになるまでに 開発者やデザイナーがどのように考え、 どのようにこだわって作っているのか？ を少しでもお伝えできればと思っています。 今回ご紹介する行程は飽くまでも一例ですし、 すべてのアイコンがこのように作られている訳ではないと思いますが ひとつの参考として読んで頂けたらうれしいです。 (最後にデザイン案件の受付についても宣伝させて頂きますので、開発者の方々も是非ご参考にしてみてくださいね。) ち
UXの定義と私たちの仕事の関係
UXデザイナーと名乗る方にとって、体験という主観的かつ概念的な要素をいかにして測定し、価値を見出すのが課題のひとつです。それについては「UXの測定項目を考えてみた」という記事で候補になりそうな項目を幾つか挙げて解説しましたが、項目を考える上で常に UX (User Experience) とは何か？という質問に辿り着くのではないでしょうか。UX に興味がある方、又は仕事としている方はそれぞれ自分で UX を定義していると思いますが、明確なラインが引けないですし、すべて自分で出来るというものではないので説明が難しい言葉です。Webデザインより説明が難しいと感じることがあります。 「UX」とひとことで言い表すことが出来るわりには、包括する分野が非常にたくさんあります。UX を作り手、顧客、マーケットなど見る切り口によって違ってきますし、数多く存在するアプローチは分断しているのではなく、密接に入
第1回 Book Club 終了と今回学んだこと : could
本 第1回 Book Club 終了と今回学んだこと 「誰のためのデザイン?」を課題図書としてはじめたブッククラブ。7週間という長いスパンで読書をしていきましたが、先週とりあえず日程をすべて終えました。幾つかのツールを使って進めた今回の企画ですが、幾つか学んだことがありました。 6月下旬にスタートした Automagic Book Club。『誰のためのデザイン?―認知科学者のデザイン原論（#abk1）』を課題図書として取り上げ、誰でも好きなタイミングで参加できる仕組みを模索しながら進めていきました。7週間という長いスパンで読書をしていきましたが、先週とりあえず日程をすべて終えました。私の Twitterアカウントでも何度か読書感想文を書いていたので気付いていた方もいらっしゃるかと思います。 敷居が低いということで Twitter を中心にやりとりをしていましたが、 Tumblrや日記に残
きんくまデザイン
こんにちは。きんくまです。 ローカルのmacのApacheを起動してWebページを設定しました。 同じmac内からだと問題なくアクセスできます。 Parallels上からのWindowsや、LAN内のWindowsマシンからアクセスすると、一部のJSファイルが Failed to load resource: net::ERR_INVALID_HTTP_RESPONSE というエラーが出て読み込めませんでした。 最初Apacheのバージョンなのかな？と思っていろいろやっていたのですが、原因は全然関係ないところにありました。 Nortonですw セキュリティソフトのNortonさんがやってました。 Advanced > Firewall > Vulnerability Protection これを一時的にOFFにすれば、読み込めるようになりました。 ローカル端末ならではのエラー原因でしたw
トラのメ！ : 絵の資料になりそうな画像ください その1
2011年06月17日15:04 絵の資料になりそうな画像ください その1 カテゴリお役立ち情報お絵かき Tweet 7：以下、名無しにかわりましてVIPがお送りします：2011/06/16(木) 00:31:25.02 ID:aUOn/wG+0 12：ヒキコモRe: ◆AloneVBiZ. ：2011/06/16(木) 01:16:16.01 ID:A1rYdgOh0 13： 忍法帖【Lv=1,xxxP】 ：2011/06/16(木) 01:19:50.23 ID:L4xyYnDZ0 14： 忍法帖【Lv=1,xxxP】 ：2011/06/16(木) 01:28:45.83 ID:L4xyYnDZ0 66： 忍法帖【Lv=12,xxxPT】 ：2011/06/16(木) 07:37:55.19 ID:fGIrohnB0 101：以下、名無しにかわりましてVIPがお送りします：2011/0
Webデザインにおける、1pxへのこだわり
☆ご注意☆ この記事は 2011年6月5日 に書いたものです。情報が古い可能性がありますのでご注意ください。 私も少しですがこの「1pxのこだわり」を日頃のデザインで使えるようになってきたので、制作方法とともにちょっとまとめてみました。 引き出しのひとつとして、デザイン勉強中の方、参考にしてもらえるとうれしいです＾＾ デザイン上級者の方々にとっては当然のことだと思うのですが、 最近つくづく思うのが、「1pxで質感が全然変わるよなぁ～」ってとても感じます。 たった1pxでピリッとしまったり、見やすくなったり、しゅっとなったり、、、と、1pxをないがしろにしちゃいけないんですねー… 今回は、私がデザイン制作時よく参考にしている、 デザイン参考集、bookma!さんの中から、色んなサイトを調べてみました。 目次 仕切り線の1px 文字をキリッと見せるための1px 動きのある1px 1pxの枠 仕
最近のインターフェイスデザインから学ぶ、7種類のボタンデザイン
ユーザーのアクションを誘う購入や送信や検索ボタンなど、最近のインターフェイスデザインでよく見かける7種類のボタンデザインを紹介します。 Common elements used in interface button design [ad#ad-2] 下記は各ポイントを意訳したものです。 また、元記事ではそれぞれのボタンを作成するPhotoshopのチュートリアルも掲載されています。 1. テクスチャを使ったボタン 2. パターンを使ったボタン 3. 3Dを使ったボタン 4. 1ピクを使ったボタン 5. 背景をインデントしたボタン 6. グロウを使ったボタン 7. ハイライトを使ったボタン 1. テクスチャを使ったボタン テクスチャはボタンにわずかな奥行きを与え、クリックが可能であることが分かるようにする素晴らしいテクニックです。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ソシオメディア | UIデザインパターン
could
