タグ

designとuiに関するmactkgのブックマーク (12)

  • 7 Principles of Rich Web Applications

    7 Principles of Rich Web Applications@rauchg|November 4, 2014 (10y ago)707,195 views This is a writeup based on a presentation I gave at BrazilJS in August 2014. It builds on some of the ideas I've been blogging about recently related mostly to UX and performance. I want to introduce 7 actionable principles for websites that want to make use of JavaScript to control their UI. They are the result o

    7 Principles of Rich Web Applications
  • UIデザイナーの私が4年間で学んだ、ダッシュボードのデザインで大切な26のこと

    モバイルアプリ相互送客ツール「Tapdaq」のメインデザイナーであり、Dashboard UI Kitの作者として知られるJan Losertさん。4年間のダッシュボードデザインの経験からまとめた26のステップは、UI/UXデザイナー必読です。 過去4年間にわたってダッシュボードとアプリケーションのデザインを続ける中、プロダクトをさらに良く効率的なものにするために、いろいろな部署と付き合っていくこと、そしてそうした部署の人たちの知識を活用することを学びました。 この記事では、私が学び、日常のルーティンに取り込んだすべてのステップを紹介しようと思います。こうしたステップがあったからこそデザイナーとして大きく成長できたと思うので、読者のみなさんに役立つことを願っています。 事前準備をする Step 1. 集められるだけの情報を集める(例示は3パターンでお願いする) 私にとって、実際に稼働してい

    UIデザイナーの私が4年間で学んだ、ダッシュボードのデザインで大切な26のこと
  • 第1回 気持ち良さはどこからくるのか~身体に近づくUIへ | gihyo.jp

    UI/UXは進歩の激しい領域のために、時に前例なしの設計が求められることがあります。たとえば近年の例では、スマートフォンやタブレットが急速に普及し、まだノウハウのない中でこれらのデバイスに特化したUI/UXが求められました。これからも誰も触れたことないデバイスや状況でも、的確な設計を行うことが求められます。 そういった未踏の領域では、先端の研究領域に注意を向ける一方、UI/UXの原点を学ぶ必要があります。コラムではインタラクションの研究者という立場から、これまでのUI/UXにおいて何が質であるかを知るのと同時に、これから向かう未来を見据えながら、今何を学ぶべきかを分析、考察していきます。そしてUI/UXに携わる人に少しでもUI/UX設計の「なぜ」に答える材料になればと思います。 効率だけでは語れない道具の設計 スマートフォンやタブレットなど、高性能な端末を持ち歩く時代となりました。ネッ

    第1回 気持ち良さはどこからくるのか~身体に近づくUIへ | gihyo.jp
    mactkg
    mactkg 2016/04/22
    “誤解が多いのは,サクサク感といった気持ち良さは,アニメーションの効果だと思ってしまうことです。”
  • The Hamburger Menu Doesn't Work - Deep Design

    This is a hamburger menu: It’s called a “hamburger” because it it looks roughly like a bun-meat-bun sandwich. (Others have insisted that it looks much more like a triple hot-dog, but they’ve thus far been unsuccessful in winning the public’s hearts and minds.) The idea behind the hamburger menu is that you can use it to hide site navigation on smaller screens, showing it only when the user clicks

    mactkg
    mactkg 2015/08/12
    The Hamburger Menu Doesn't Work
  • 7 future web design trends

    1. Gestures are the new clicksWe forget how hard scrolling webpages used to be. Most users would painstakingly move their mouse to the right edge of the screen, to use something ancient called a ‘scrollbar’: As a pro, you probably used a mouse wheel, cursor keys, or trackpad, but you were way ahead of most users. In 2015 it’s far easier to scroll than it is to click. On mobile, you can scroll wild

    7 future web design trends
  • Little Big Details

    Twitter — When you lose your internet connectivity, you’ll get an option to copy the text that you’ve typed to DM someone on Twitter.

    Little Big Details
  • Shunter • [和訳] フラットピクセルズ ~ フラットデザインとスキュアモーフィズムの戦い ~

    最近、来るiOS7でフラットデザインが取り入れられ、それによってリリースが遅れているというニュースがありました。 iOS 7、大幅アップデート過ぎて公開が遅れるかも - Gizmodo アップル、次期「iOS」で「フラット」なUIデザインを採用か 実は、個人的に実世界の物をメタファーにデザインを組むことを絶対美だと信していた節があったので、このニュースは衝撃でした。 そんな時、このトピックに関する面白いブログ記事を見つけました。「flat pixels ~The Battle Between Flat Design & Skeuomorphism~」です。 Skeuomorphism(スキュアモーフィズム)とはソフトウェアのUIに過去の実世界の物の特徴を取り込むデザイン手法のことなのですが、これとメトロUIに代表されるFlat Design(フラットデザイン)について、よく比較しま

  • UI/UX設計の教科書、About Face 3輪講の資料を公開します - ninjinkun's diary

    一昨年に社内で行ったAbout Face 3輪講の資料を公開します。実は今までずっと公開されていたのですが、存在を知られていなかったので、改めて周知します。 About Face 3はUI/UX設計の教科書で、ユーザーストーリーやペルソナなど、基的な内容が押さえられています。ディレクター、デザイナー、エンジニア、サポート等、プロダクト制作に関わる全員の共通知識として使える内容だと思います。 About Face 3輪講概要 1. ゴールダイレクテッドデザイン 2. 実装モデルと脳内モデル 3. 初心者、上級者、中級者 5. ユーザーのモデリング : ペルソナとゴール 6. デザインの基礎 : シナリオと要求 8. 優れたデザインの総合 : 原則とパターン 10. オーケストレーションとフロー 11. 間接的な操作を取り除く 12. 良き振る舞いのデザイン 13. メタファ、イディオム、ア

    UI/UX設計の教科書、About Face 3輪講の資料を公開します - ninjinkun's diary
  • インタフェースの大変動 最初の三〇年は始まりにすぎなかった。

    インタフェースの大変動 最初の30年は始まりにすぎなかった InterCommunication No. 60 Spring 2007 特集「デザイン/サイエンス」 に寄稿 渡邊恵太 稿は、近年のインターフェイス・デザインの考え方の変化について述べるものである。最初にインターフェイスの視点から現在動きの活発な企業や考え方について紹介する。そして、その企業に共通する点から認知科学的アプローチの限界を示唆する。それを背景に、これからのインターフェイスの考え方について述べる。 はじめに 今日のユーザー・インターフェイス研究の流れは、大きな変化を見せはじめている。たとえば、Macintoshとユーザー・インターフェイスは切っても切れない関係で、常に先端をリードしてきた存在である。そのApple社が先日の「Macworld Expo 2007」にて、「最初の30年は始まりにすぎなかった(The f

  • ニコニコ超デザイン-Metro考察編-

    ニコニコ超デザイン-Metro死闘編- http://www.slideshare.net/VoQn/metro-12761898 の続きです, 元々は社内勉強会の資料として作成しました 死闘編は経緯だったりネタ的な要素に走りすぎたのでデザインに関するナレッジはここにまとめてあります より実践的かつ具体的なノウハウ等は正規リリース後あたりで公開したいと思っています

    ニコニコ超デザイン-Metro考察編-
  • ユーザーにとってはUIがすべて:UIデザイン原則をソシオメディアが語る - builder by ZDNet Japan

    シーネットネットワークスジャパンは9月29日、builderとしては2回目のイベントとなる「builder tech day」を開催した。今回は「User Interface & beyond」をテーマに、ソシオメディア、マイクロソフト、アドビシステムズ、カールのスピーカーが登壇し、ユーザーインタフェースの現在と未来について講演した。 稿では、ソシオメディア取締役である上野学氏の基調講演「ユーザーにとってはUIがすべて」を紹介しよう。 トイレにひそむUIのヒント 講演の冒頭、上野氏は米国の著名なデザイン・コンサルティング・ファーム、Adaptive Pathに2008年まで在籍していたDan Saffer氏と対話した際のエピソードを披露。 Saffer氏が「トイレにはユーザー・インタフェース・デザインの様々なヒントがある」と話していたことを紹介し、下の画像を示した。 上野氏は赤色の注意書

    ユーザーにとってはUIがすべて:UIデザイン原則をソシオメディアが語る - builder by ZDNet Japan
  • MOONGIFT: » アジャイルUIプロトタイピング「fluidIA」:オープンソースを毎日紹介

    fluidIAはHTML/JavaScript製のオープンソース・ソフトウェア。Webサイトを開発する際にモックから入るのは基だ。テキストから考えていては各自の中で想定されるイメージが異なってしまう。頭のイメージを書き出すことでより具体的になるはずだ。 簡易的に画面を定義する デザインレベルではないが、画面の動きを含めて確認するのに役立ちそうなのがfluidIAだ。アジャイル向けとある通り、シンプルにさくっと流れを確認して開発にとりかかるようなスピード感が出せそうなソフトウェアだ。 fluidIAはHTML/JavaScript(jQuery)で作られている。オブジェクトとテキストを配置して最低限必要な情報を定義する。そして流れを定義する機能を使ってスナップショットで画面を固定化したり、マウスクリックを模したり出来る。 アクションを定義する プレゼンモードでは定義した流れに沿って確認が進

    MOONGIFT: » アジャイルUIプロトタイピング「fluidIA」:オープンソースを毎日紹介
  • 1