タグ

Design考察に関するnakagawのブックマーク (46)

  • PCサイトのUIデザインにおける12のトレンド | ベイジの社長ブログ

    スマートフォンの普及で、PCで閲覧するWebサイト(以下、PCサイト)に対する注目度は下がっています。しかし、BtoBのデジタルマーケティングにおいては、PCサイトが今後も戦略の中心になるでしょうし、BtoCにおいても、PCサイトが不可欠な領域もまだまだ多いです。 ハードウェア的に大きな変化のないPC向けのWebデザインというと、ノウハウは固定化されている印象もありますが、実際には時代の流れを受け、今も変化を続けています。特に以下のような環境変化が、PCサイトのUIデザインにも大きな影響を与えています。 表示デバイスの多用化 スマートフォンアプリの一般化 タッチスクリーンの普及 トレンドに合わせれば成功、というではありませんが、その根底に流れているユーザ動向の変化については、十分に理解しておく必要はあるでしょう。そこでこのエントリーでは、PCサイトのUIデザインにおける最新動向を、その背景

    PCサイトのUIデザインにおける12のトレンド | ベイジの社長ブログ
  • フラットデザインへの長期接触: このトレンドが、どうユーザーの効率を下げているか

    クリックできるUI要素のシグニファイアがなかったり弱かったりすると、ユーザーは次第にページ中をあやふやなままクリックしたり、マウスオーバーするようになる。そうすると、効率が落ちる一方、コンテキストからの手がかりやクリックへの即時フィードバックがより期待されるようになる。 Long-Term Exposure to Flat Design: How the Trend Slowly Decreases User Efficiency by Kate Meyer on November 8, 2015 日語版2015年12月21日公開 完全にフラットなビジュアルデザインのインタフェースではリアリズムや立体効果をまったく利用しない。それは結果的に、クリックできることをユーザーに伝えるために従来から利用されてきた強制的な視覚的手がかりに引導を渡すものであった。 極端にフラットなインタフェースの人

    フラットデザインへの長期接触: このトレンドが、どうユーザーの効率を下げているか
  • 新着記事

    『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年3月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材/配色やWeb制作といった最新トレンドも公開中。

    新着記事
  • デザインの役割からみる「トーン」と「マナー」

    こんにちは。デザイナーの山口陽一郎です。 去る2014年2月19日(水)に、株式会社パソナテック様主催のセミナー「クリエイターのためのトーン&マナー設計」にて登壇させていただきました。 皆さんは「トーン&マナー」という言葉を耳にしたことがありますか?「トンマナ」と略されることの方が多いかもしれません。その説明の前に、ちょっと寄り道をさせてください。 ■デザインのふたつの役割とトーン&マナーの演出 デザインには大きく分けてふたつの役割があります。 1. 機能性を高める これはユーザーにとって製品をより使いやすくしたり、誤操作の危険をなくしたり、迷わないようにサポートするための役割です。 そしてもうひとつが今回のセミナーのテーマとしてとりあげた、 2. トーン&マナーの演出 です。製品に、それが使われる場にふさわしい属性・キャラクターを付与する役割です。 たとえばレジャーグッズなら「楽しさを想

    デザインの役割からみる「トーン」と「マナー」
  • Webデザイナーが捗る!知識を増やす最近のトレンドまとめ

    作成:2014/09/29 更新:2014/11/01 Webデザイン > Webデザインの流行りを知るために、トレンド感のある配色や洗練されたレイアウトをつくり上げるために、知っておきたいことや方法など。他に、Web制作において今後積極的に挑戦してみたいものをまとめました。 エンジニア速報は Twitter の@commteで配信しています。 もくじ 配色 1.ネオンカラー 2.washed out 3.グラデーション 4.マテリアルデザイン 模様 5.ジオメトリー 背景 6.背景色を時間の経過で変化させる 7.スクロールで背景固定、コンテンツだけ動かす 一部に動きをつける 8.シネマグラフ 9.線画 (SVG) 10.グリッチ UI・他 11.ゴーストボタン 12.プレースホルダー 13.ローディングエフェクト 14.pushState 15.ドロアー レイアウト 16.タイルレイアウ

    Webデザイナーが捗る!知識を増やす最近のトレンドまとめ
  • 魔法の図形 第 I 章

    魔法の図形 TOP >> 魔法の図形(第I章) 第Ⅰ章 序 Ⅰ-1.シンプルな図形 Ⅰ-2.様々な星型の図形 第Ⅱ章 ソロモン王の魔法円 序文 Ⅱ-1.土星の魔法円 Ⅱ-2.火星の魔法円 NEW 参考文献: "黄金の夜明け魔法体系4 召還魔術" (著:イスラエル・リガルディー、翻訳:日浦 幸雄、責任編集:秋端勉、発行:国書刊行会) "エピソード魔法の歴史 黒魔術と白魔術" (著:G・ジェニングズ、翻訳:市場 泰男、発行:(株)社会思想社) "魔女の秘法 白魔術と黒魔術の秘密" (監修:魔女バベッタ、佐藤有文、発行:KKワールドフォトプレス) 第Ⅰ章 序 ファンタジーでは、様々な魔法が登場し、それとともに魔術的な意味や力を持つ、いわゆる魔法陣と呼ばれる図形や印象が登場することも少なくありません。ここでは、これらの魔術的図形について、少しずつ紹介していきます。 古い時代から、神秘的な力を呼び集

  • Appleがトップページで自動送りカルーセルをやめた理由

    残念ながらページ全体のキャプチャをとっていなかったので下までお見せできませんが、ページのメイン要素となるカルーセルの下にはフッターしかありませんでした。ほんとですw そして、おぉ、さすがApple。 ここでも思い切った選択をしたな〜と思っていたわけです。 ところが! 数日後にもう一度トップページを見てみたら、あの懐かしの4つのボックスが戻っているではないですか!? 実は、このレイアウト(巨大ヒーローイメージと4つのフィーチャーボックス)が、何年も続いたAppleの鉄板レイアウトだったわけですが、先日のリニューアルでこのフィーチャーボックスがなくなっていて「ついに、あれもお亡くなりになられたか」と、密かに悲しんでおりました。 その後のこの華麗なカムバックです。 かなり興奮してしまいました。 しかも、スタイルも細かいスペースや背景の扱いがよりシンプルなものに更新されています。 iPadでみると

    Appleがトップページで自動送りカルーセルをやめた理由
  • 国产精品V欧美精品V日韩精品,免费无码不卡中文字幕在线,日韩亚欧无码人妻在线视频_日韩人妻无码精品一专区_亚洲区日韩精品中文字幕,国产精品特级露脸AV毛片,色噜噜狠狠综合影院色欲,在线播放免费人成视频在线观看

    究極の癒し系!天然おっとり美少女が悩殺グラマーFカップ体型で性欲を煽ってくるホテルお籠りハメ撮り 有花もえ

    nakagaw
    nakagaw 2014/09/23
    カタカナとか理論とか
  • 説得力がグンと上がる!UIデザインの心理学 | クリエイティブ思考 | ブログ | 東京のWeb制作会社・ホームページ制作|QUOITWORKS Inc.(株式会社クオートワークス)

    オライリーから出ている「ユーザーインターフェースデザインの心理学」から使えそうなものを実例を踏まえピックアップ!これでUIデザイン説明の説得力をあげよう! 情報は一度にすべて見せるのではなく、そのとき必要なものを段階的に開示させた方がよい デザイナーが犯しがちな失敗は一度に大量の情報をユーザーに与えてしまうことです。 情報は一度に大量に与えるのではなく、その時点で必要としている情報だけを与えるほうが様々なニーズに対応することができます。 ユーザーの中には大まかな説明でよい人もいれば、詳細を知りたがっている人もいます。 つまりどういう事? 情報は一度に見せるのではなく段階的に見せる。 重要なのはクリック回数ではない。クリックのたびに必要な情報が手に入るのであればユーザーは喜んでクリックする。 誰がいつ何を必要としているかを理解する。各段階で何を必要としているか的確に把握していないと、この手法

    説得力がグンと上がる!UIデザインの心理学 | クリエイティブ思考 | ブログ | 東京のWeb制作会社・ホームページ制作|QUOITWORKS Inc.(株式会社クオートワークス)
    nakagaw
    nakagaw 2014/09/22
    こういうアウトプット良い
  • 「シンプルなデザイン」の難しさ デザイン会社 ビートラックス: ブログ

    日々デザイナーとしての仕事をする上で、クライアントから「シンプルな感じで良いので、とりあえず簡単に作って下さい」と言われることがある。難しい機能はあまり無くても良いから、シンプルなものを “さくっと” 作ってもらいたい、という要望。 このセリフを聞くたびに、実はめまいにも似た感覚を覚える。 恐らくデザインに対するコストを下げたいとの思いから ”シンプルで良いので” と言っているのだと思うが、実はシンプルなものの方が複雑なものよりもデザインするのが数倍も難しい。 それを知らずに、シンプル=楽につくれる=コストが低い、と思っている人々が後を絶たない。大きな間違いである。 シンプルなデザインや、ミニマリズムと呼ばれる極限まで無駄を削ぎ落としたデザイン技法は、最高レベルのデザイン技術を要する。 シンプル = 最高峰の問題解決あっさりして見えるものがあっさりと作られたかというと大間違いであり、最終的

    「シンプルなデザイン」の難しさ デザイン会社 ビートラックス: ブログ
    nakagaw
    nakagaw 2014/09/19
    定期的にある話。シンプルとはおじいちゃんのシワや大木の年輪みたいなもの。
  • Material Designを見てみた - クックパッド開発者ブログ

    モバイルファースト室の @kaa です。 Googleが先日IOで発表したMaterial Designについての資料を見て、元Flasherの視点で いまさら思った事などまとめてみます。 Material design - YouTube アニメーション、スタイルのページについてメモです。 レイアウトのページ以降はまた次回に。 Introduction http://www.google.com/design/spec/material-design/introduction.html メタファーは紙? カードは紙をイメージ、という話ですが、どうでしょうか? もし紙だったらテクスチャの質感や表示時に傾く、ゆれる演出が入るんじゃないかと思います。 四角形がゆがむことはないので紙の見え方とは少し違いますし、紙のやわらかさがないですよね これのMaterial responseとか 紙ですと均

    Material Designを見てみた - クックパッド開発者ブログ
  • マテリアル・デザインって何? Androidデザイン責任者にインタヴュー

    マテリアル・デザインって何? Androidデザイン責任者にインタヴュー2014.07.08 12:009,401 福田ミホ 目指すのは、脳にスッと入ってくるデザイン。 2年前にグーグルAndroid Jelly Beanを発表したとき、米Gizmodoでは当時Androidのユーザーエクスペリエンスのディレクター、マティアス・デュアルテ氏とAndroidの方向性について議論しました。時は変わって先週のGoogle I/Oでは、今はデザイン担当ヴァイスプレジデントとなったデュアルテ氏がマテリアル・デザインを発表しました。 米Gizmodoでは再びデュアルテ氏の話を聞く機会を得て、Androidのデザインの試みと、それがグーグルの未来にもたらす意味について聞いてきました。 マテリアル・デザインは大胆な試みです。ひとつのUIフレームワークを、腕時計から車までグーグルの生態系の全デヴァイスに使

  • 否定派によるフラットデザイン擁護論 - UXエンジニアになりたい人のブログ

    わたしはフラットデザインの否定派だ。 コンピューターはあらゆる物事をあらゆる角度から解決してくれる。それゆえ「なにを意図してどう解決させようとしているのか」をうまく伝えないと、とっつきづらさや失望につながってしまう。画面上の凹凸、ウインドウの形、マウスカーソル、タッチスクリーン上のめくれた紙風のエフェクトなど、UI上の様々な表現はコンピューターに『わかりやすさ』『親しみやすさ』を求めて先人たちが苦労を重ねてようやく創り上げた“共通言語”であり、UXの基礎をなすものだ。この先人の知恵と苦労の結晶を単なるオシャレさだけで破壊するのは合理性に欠ける。 というのが基的な主張だ。もっと端的に行ってしまえば、ボタンも境界もわからないような画面をみてもどう使っていいかわかんないじゃないかバカ、である。いまもその気持ちはあまり変わっていない。 しかし、最近別の視点もあるな、と思い始めたのでそれを記してみ

    否定派によるフラットデザイン擁護論 - UXエンジニアになりたい人のブログ
  • Webサイトでの正しいブランディングと3つのベネフィット | ベイジの社長ブログ

    Webサイトのリニューアルを担当する際に「Webサイトでブランドイメージをもっと伝えたい」と依頼されることがよくあります。では「Webサイトでブランドイメージを伝える」というのは、一体どうすることなのでしょうか。 ブランドイメージとは来企業が持っているものではなく、顧客の心の中に作られるものです。そのため厳密には、企業から「Webサイトでブランドイメージを伝える」ということはできません。企業ができることは、「Webサイトを見た顧客の心の中に、企業が望んでいるイメージに近いブランドイメージを描かせる」ということです。ブランドイメージがそもそも顧客の中に存在するものである以上、主導権は顧客にあり、企業ができるのはそこに影響を与えることだけです。 そのため、顧客の心を無視し、企業にとって都合のいいイメージだけを一方的に発信する、というのはもってのほかでしょう。企業側が勝手に望んでいる「かっこい

    Webサイトでの正しいブランディングと3つのベネフィット | ベイジの社長ブログ
  • 【成果を上げる色の選び方】色彩心理学から学ぶ サイトカラーの「正解」 | LISKUL

    Webサイトの見た目を改善するために、これまでたくさんの「配色デザイン」のや記事が投稿されてきました。これらの情報を使えばあっという間にサイトの配色を決めることができます。 ただその配色、「自分が好きな色」になっていませんか? それぞれの商品やサービスの配色には「正解」があります。 今回「サイト」「ロゴ」「コンバージョンボタン」に分けて、それぞれに対して有効な色や法則をまとめてみました。 自分のウェブサイトではどんな色が一番理想的なのか、実例を参考にしながら導き出してみましょう! また、この記事は無料でPDFとしてダウンロードも可能です。配色デザインを考える際にお手元に置いておくのがおすすめです。 【PDF】【成果を上げる色の選び方】色彩心理学から学ぶ サイトカラーの「正解」>>無料ダウンロード そもそもなぜ「色彩」が大切なのか? 引用元:Why All Sale Sings Are R

    【成果を上げる色の選び方】色彩心理学から学ぶ サイトカラーの「正解」 | LISKUL
  • UIデザインにおけるナビゲーションのデザインパターンまとめ | ベイジの社長ブログ

    前回エントリーでは「UIデザイナーが理解しておくべき11種類のナビゲーションと特徴」として、ナビゲーションの種類を、機能的な側面から分類し、ご紹介しました。 続編となる今回は、ナビゲーションをデザイン的な側面からとらえ、形状、ふるまい(動き)、階層というの3種類の表現軸に分けて、ナビゲーションでよく使われているデザインというものを整理してみました。 形状のデザイン UIにおけるナビゲーション要素が、主にどのような形状でデザインされているか、というパターンをここではご紹介しています。 メニューバー メニューをボタン化し、バー状にまとめたデザインです。PCサイトのグローバルナビゲーションやローカルナビゲーションなどによく採用されます。 一覧性に優れ、一目でナビゲーション要素と分かるため、ユーザビリティに優れます。一方、ある程度の表示スペースを必要とするため、スマートフォンではあまり用いられない

    UIデザインにおけるナビゲーションのデザインパターンまとめ | ベイジの社長ブログ
  • 「紙っぽいデザイン」の特徴を盗め!イベントポスター事例から学ぶ、紙っぽいデザインの特徴 | デザイン | ブログ | 東京のWeb制作会社・ホームページ制作|QUOITWORKS Inc.(株式会社クオートワークス)

    クオートワークスのブログ 東京のWeb制作会社 株式会社クオートワークスのブログです。ここではWeb制作におけるノウハウやナレッジ、ビジネスに関する覚書などまとめて発信しております。 quoitworksのムラマツこと、muuuuu.orgの中の人、ムーちゃんです。こんにちは。お盆休みまでもう少しですね!みなさま仕事の進捗はいかがでしょうか。 webのデザインの現場でよくオーダーとしてあるのが、「紙っぽいデザイン」です。 webのデザインはコーディング時のことを考えすぎてしまったり、ユーザビリティや、web独自の視線の流れを意識しすぎてしまうあまりにダイナミックさに欠けたりすることが多いような気がします。 またお客さんとしても生まれてからwebを見ている時間よりも、紙のデザインを見ることが多いので、イメージとして紙(ポスター、雑誌)のような完成図をイメージされることが多いのではないのでしょ

    「紙っぽいデザイン」の特徴を盗め!イベントポスター事例から学ぶ、紙っぽいデザインの特徴 | デザイン | ブログ | 東京のWeb制作会社・ホームページ制作|QUOITWORKS Inc.(株式会社クオートワークス)
    nakagaw
    nakagaw 2014/08/12
    テンションあがる
  • 自動家計簿のMoney Forward。KPI11%アップを達成したiOSアプリの新UIデザインは、こうして作られた! | Goodpatch Blog

    Goodpatchは自動家計簿サービスMoneyFowardのiPhone版アプリリニューアルを担当しました。今回はリニューアルプロジェクトを終えて振り返りを兼ねて、Money Forwardの取締役開発部長 都筑貴之さん、サービス開発部マネージャー 村里健太さんのお二人にインタビューをさせて頂きました。弊社からはプロジェクトに関わった、代表の土屋尚史、UIデザイナーの貫井伸隆、ディレクターの齋藤恵太の3人が参加しました。 ―― まずはMoney Forwardの事業について教えてください。 都築 Money Forwardは、パーソナルファイナンスのサービスです。パーソナルファイナンスは「個人の資産をすべて一括で管理、活用する」というサービスで、まだ日では新しい概念です。アメリカにMint.comというパーソナルファイナンスに特化したベンチャーがあるのですが、代表の辻とCOOの瀧が

    自動家計簿のMoney Forward。KPI11%アップを達成したiOSアプリの新UIデザインは、こうして作られた! | Goodpatch Blog
  • I/O 2014 アプリに学ぶマテリアルデザイン

    .app 1 .dev 1 #11WeeksOfAndroid 13 #11WeeksOfAndroid Android TV 1 #Android11 3 #DevFest16 1 #DevFest17 1 #DevFest18 1 #DevFest19 1 #DevFest20 1 #DevFest21 1 #DevFest22 1 #DevFest23 1 #hack4jp 3 11 weeks of Android 2 A MESSAGE FROM OUR CEO 1 A/B Testing 1 A4A 4 Accelerator 6 Accessibility 1 accuracy 1 Actions on Google 16 Activation Atlas 1 address validation API 1 Addy Osmani 1 ADK 2 AdMob 32 Ads

    I/O 2014 アプリに学ぶマテリアルデザイン
  • アプリUI/UXデザイナー必見!「ハンバーガーボタン」ナビゲーションを使うとユーザーエンゲージメントが半減することが発覚 | ゴリミー

    あなたが作っているナビゲーションボタンは今流行りの「ハンバーガーボタン」、またの名を「ナビゲーションドロワー」を採用しているだろうか。それとも一覧で表示している「タブボタン」を採用しているだろうか。 クリーンでシンプル、メインコンテンツの表示領域が最も広く確保できるなどいいこと尽くしの「ハンバーガーボタン」ナビゲーション。一方で、常にボタンが表示されメインコンテンツの表示領域が必然的に狭くなってしまう「タブボタン」ナビゲーション。見た目のデザインとしては当然「ハンバーガーボタン」の方が良い。では実際にユーザーとしても同様の見解なのだろうか。 クリーンでシンプルだが、ユーザーは操作方法を覚えられない 「ハンバーガーボタン」もしくは「ナビゲーションドロワー」と呼ばれるナビゲーションUIは数多くのアプリに見られる。Googleもアプリデベロッパー向けにオススメのデザインパターンとして推奨している

    アプリUI/UXデザイナー必見!「ハンバーガーボタン」ナビゲーションを使うとユーザーエンゲージメントが半減することが発覚 | ゴリミー