ログイン - はてなパスワードを忘れた方はパスワードの再設定を行ってください。 初めての方ははてなID登録 (無料) してください。 うまくログインできない方はお問い合わせをご覧いただき、Cookieの設定をご確認ください。
【トレンド予想】海外の著名Webデザイナー6人が語る2017年のUI・UXデザイン｜SeleQt【セレキュト】
2016年も残り1カ月ほどとなりました。 今年もいろんなWebデザインのトレンド／スタイルが生まれ、そして消えていきましたね。来年2017年は一体どんなトレンドが来るのか？という予測記事が話題を集めていますが、海外のデザイナーたちは2017年にどんな目線を送っているのでしょうか？ 本稿では著名な6人の海外デザイナーたちの予想をまとめてみました。 海外の著名デザイナーたちの2017年トレンド予想 Adham Dannaway氏： UX/UIデザイナー&フロントエンドエンジニア ・美しさよりもユーザビリティにフォーカスされるのではないでしょうか。ユーザーエクスペリエンスはより一貫した、実用的で使いやすいものになるでしょう。この流れから、個性を失ってしまうデジタル製品も出てくるのではないかと危惧しています。 ・プロトタイピングとインタラクションデザインもフォーカスされそうです。過去数年で30以上
【UXの迷信】デザイナーが細かいディテールにこだわるべき理由
ZoltánはCentralway（チューリッヒのソフトウェア企業）のUXデザイナー長。元UstreamのUXディレクター。美しく、且つ使えるプロダクトを作ることに情熱を燃やしています。 「細かいディテールこそがデザインを形作るものだ」とイームズチェアで有名なCharles Eames氏は言います。エラーメッセージや細かい文言、カテゴリーのページに表れる商品の順番などは、ユーザー体験や最終的な利益に大きく影響します。 細かいディテールは非常に重要です。例えばAppleの本質は、最小のビット数まで、徹底的にディテールにこだわる姿勢そのものにあります。 どういったことを細かく最適化すれば、利益に結びつくのか ・BestBuy.comでは、登録しなくても購入できるようにシステムを少し変えただけで、一年あたり３億ドルも売り上げが伸びました。―The ＄300 Million Button ・Cli
アプリを作る時に必ず押さえるべきデザインのポイント7つ
by Jorge Quinteros 「1つのスクリーンにつき1つのタスク」「プッシュ通知の利用の仕方」「余白を作ること」など、ソフトウェア開発者のNick Babichさんがモバイルアプリ作りで押さえるべきUXデザインの7つのポイントをまとめています。 Mobile Design Best Practices http://babich.biz/mobile-design-best-practices/ ◆1：1つのスクリーンにつき1つのタスク 配車サービス「Uber」のアプリを見てみると、非常にシンプルな作りになっているのがわかります。Uberを使う人の目的は「タクシーを捕まえること」とはっきりしているため、アプリの画面にはユーザーの現在地が自動的に表示されるだけで、ユーザーがすべきことは「タクシーに乗る場所を選ぶ」ということのみとなっています。 アプリを理解しやすくし、操作を簡単にす
ニュース系アプリから見る、参考にしたいUIデザインアイデア10個まとめ
ここ数年間でニュースメディアは大変な盛り上がりとなっており、ストーリーテリング（英: Storytelling）と呼ばれる雑誌など出版物のオンライン体験を軸にした、新しい戦略が生まれています。ウェブサイトはリニューアルされ、さまざまなアプリも制作されていることから、ニュースメディアはデザイナーにとってデザインの参考にできる機会にたくさん恵まれています。 この記事では、UIデザイン制作の参考にしたいニュースアプリデザインを集め、各UIのメリットとおすすめポイントをまとめてご紹介します。実際に使われているアプリから、開発中のデザインまでが揃っています。 詳細は以下から。 ニュース系アプリから見る、参考にしたいUIデザインアイデア１０個まとめ Urkanian News Portal Credit: Toma Reznichenko 参考にしたいポイント 通常のニュースメディアでは、コンテンツを
UI談義のすすめ
https://dribbble.com/shots/1679085-Mobile-UI-Blueprint-freebie私の職場ではUIについてのマニアックな談義が行われることがあります。アプリやwebだとかのデザイン会社なので周囲にはUIやUXのプロフェッショナルが集まっていて、『UI談義』の文化が根付いています。 UIを解剖するためのUI談義UI談義とは、UIオタクで集まってUIのことをひたすら考察し合うだけの集まりです。ここには職種問わず誰でも参加が可能で、UIデザイナーはもちろん、iOSデベロッパー、Androidデベロッパー、PM、マネージャーなどなど、あらゆるタイプの人が集まります。 UI談義のテーマは突如設定されます。普段利用しているアプリのちょっとしたインタラクションが気になったらそこでUI談義が始まります。iOSのアップデートでApple純正アプリのUIが変わったタイ
【保存版】離脱に悩むデベロッパー必見！アプリのUI/UXの改善に役立つスライド資料7選 | ザクマガ！
はじめまして。現在SEREALというチームで、福岡を拠点に活動しているデザイナーの堤健太郎と申します。福岡の大学に在学中ドイツに1年半留学して、卒業後は東京にて3年ほど働き、去年から福岡に戻ってきました。日々の業務と並行しながら、Facebookグループ「UI Fukuoka」を通して福岡のUIデザイナ―向けのミートアップイベントなどを開催しています。今回は、アプリのUI/UXに関して「ザクマガ」へ寄稿させていただきました。 さて、皆さんはこういう悩みに直面したことはありませんか？ 「打ち合せのときは必要そうに見えていた機能が、実際に組み込んでみたら誰も使わなそう…」 「ぱっと見たらいい感じだけど、使っていると何か使いにくい…」 「新規ユーザーの大部分が1週間以内に離脱している…」 こうした問題は、アプリのUI/UXデザインに原因があると考えられます。ユーザーとの接点であるUI（User
ネタがない！という時に役立つサイト6選 | DevelopersIO
こんにちは。最近ホット葡萄が手放せない宮嶋です。 まさか11月に雪が降るとは……。 はじめに デザイナーなら必ずぶち当たる問題。 ネ タ が な い ！ ！ ！ こればかりは、どんなに引き出しがあっても世のデザインが常に変化している限り出てきてしまうものです。 頭の中で漠然とイメージが出来ていても、実際にデザインに起こすとなると手が止まってしまったり……。 そんな時に私がよく見ているサイトをご紹介します。 参考サイト紹介 1. Pinterest https://jp.pinterest.com 世界中のおしゃれアイデアをまとめたサイト。 UIデザインに関するものだけでなく、紙面やインテリアなど幅広いカテゴリも探せます。 気に入った作品があったら自分のボードにピンとして保存することができます。 また、プラグインを使えば外部サイトで良い作品に出会えた時にピンにできるので便利です。 2. Dr
Webデザインでよく使うUI要素の名称・用語一覧 - Qiita
Overview Webサイトを作っているとよく出てくるUIの名称を、ざっくばらんにまとめました。 人や会社ごとで固有の呼び方があると思いますが、私の場合こんな感じです。 コミュニケーション円滑にな〜れ ※2016/11/28 はてブコメントなど参照させていただき、少し更新しました。 ポップアップ表示系 ▼ アラート JSのalertかブラウザのデフォルト機能で出るやつ。ダイアログとも。 ▼ モーダル・モーダルウィンドウ 閲覧中のページにカバーを重ねて表示させるやつ。 modalは「このページはいま入力モードだぜ」といった意味合いでmodeを形容詞化したことば。 ▼ ツールチップ・ポップアップ表示 マウスオーバーすると吹き出しとかで表示されるUI。 補足説明などで使用されることが多い。 ▼ ポップアップウィンドウ 閲覧中のウィンドウとは別に、勝手に立ち上がるウィンドウ。 スパイウェアなどの
UIデザイナーの私が4年間で学んだ、ダッシュボードのデザインで大切な26のこと
モバイルアプリ相互送客ツール「Tapdaq」のメインデザイナーであり、Dashboard UI Kitの作者として知られるJan Losertさん。4年間のダッシュボードデザインの経験からまとめた26のステップは、UI/UXデザイナー必読です。 過去4年間にわたってダッシュボードとアプリケーションのデザインを続ける中、プロダクトをさらに良く効率的なものにするために、いろいろな部署と付き合っていくこと、そしてそうした部署の人たちの知識を活用することを学びました。 この記事では、私が学び、日常のルーティンに取り込んだすべてのステップを紹介しようと思います。こうしたステップがあったからこそデザイナーとして大きく成長できたと思うので、読者のみなさんに役立つことを願っています。 事前準備をする Step 1. 集められるだけの情報を集める（例示は3パターンでお願いする） 私にとって、実際に稼働してい
デザイン・プロセスの話はもうやめよう
photo cred: Enric Martinez on Flickrデザインについて考える前に、料理についての話をしましょう。初めて料理をした時、皆さんはレシピ通りに作ったのかもしれませんね。材料はどれくらい必要でどう調理すれば良いかレシピを参考にしたことでしょう。 料理が上手くなるにつれ、材料についてはざっくり確認するだけで済ませ、調味料も目分量で大体分かるようになります。オーブンの予熱についても細かく温度を調べなくとも経験をもとに設定できるようになるでしょう。かなり上達してくると、手元にたまたまあるものを上手く利用したり、興味を引く初めての材料を使ってみたり、食事を一緒に楽しむ仲間の好みを考えたり、旬の野菜を使ってみたりと様々に試して新しいレシピを考え出すはずです。 レシピに書かれている順序やプロセスは新しい料理を始めるきっかけや手ほどきにはなるかもしれません。しかし、あなたを本物
モバイルの使いやすさを劇的向上！参考にしたい7つのポイントまとめ
アプリはコンテンツやサービスを提供するために、信用できる主流の方法となっています。しかし、さまざまなサービスが乱立する市場では、どのようなモバイルアプリが役立ち、関連性が高く評価され、ユーザーを楽しませてくれるでしょう。 今回は、本当に素晴らしいモバイルユーザーエクスペリエンスを生み出す鍵となる、7つのUXデザインのヒントを見ていきましょう。 コンテンツ目次 1. ひとつのスクリーンに、ひとつの課題を。 2. 見えないユーザーインターフェース 3. たっぷりの余白スペースを。 4. ナビゲーションはシンプルに。 5. 片手による操作 6. アプリの表示時間を早く。 7. プッシュ通知を賢く使おう。 01. ひとつのスクリーンに、ひとつの課題を。 ユーザーが望む結果を得るために必要な労力をできるだけ軽減しましょう。 アプリのために設計したすべてのスクリーン画面は、それを使っているユーザーが本
サーバサイドエンジニアが考える、エラー発生時のより良いUX
誰のためのエラーメッセージなのか意識する 私はサーバサイドエンジニアとして API を提供する立場なので、サーバ起因のエラーが起きたときに適切な情報を伝えるために何ができるかを考えてみます。 サーバサイドの視点では、クライアント（顧客）は２者存在すると考えることができます。 ひとつは、もちろんアプリケーションを実際に利用するエンドユーザ。 もうひとつは、サーバサイドが提供する API を利用するクライアントサイドエンジニア。 同じ事象でも対象によって伝えるべきエラーメッセージは変わってきます。 たとえば、エンドユーザにデータベースのエラーコードをそのまま伝えても不親切です。逆にクライアントサイドエンジニアに「不正なリクエストです」としか伝えなかった場合、何がどう不正なのか分からず、原因を切り分けるためにより詳しい情報を知りたいと思うでしょう。 つまり、それぞれの立場にたって「何の情報を伝え
流行なんて関係ない！いつでも使える黄金ウェブレイアウトUIパターン12個まとめ
海外サイトUXPin Studioで公開された「Web Layout Best Practices: 12 Timeless UI Patterns Analyzed」の著者 Jerry Cao より許可をもらい、翻訳転載しています。 ウェブサイトを訪れるユーザーの多くは、コンテンツを楽しみにしており、デザイン目的で訪れているわけではありません。 この記事では、いつの時代にもマッチする、12種類の黄金ウェブレイアウトパターンを問題点や解決法、具体的な使い方のポイントと一緒に見ていきましょう。 コンテンツ目次 01. カード型レイアウト 02. グリッドレイアウト 03. マガジンレイアウト 04. 枠なしレイアウト 05. スプリット・スクリーンレイアウト 06. 単一ページレイアウト 07. F型パターンレイアウト 08. Z型パターンレイアウト 09. 水平方向の左右対称パターンレイア
モバイルデザインで押さえておきたい６つの基礎テクニック
最近のインタラクションデザインの成功例を調べてみると、どれも基礎をしっかりとおさえたものとなっています。これらのデザインには共通して、人間の自然な行動をもとにし、私たちが気づかないところで障壁となるものを取り除いています。ビジュアルの表現やインタラクティブな体験が重視されており、中でも読みやすさ、理解しやすさは特に重視されます。 それでは、最も重要なデザインテクニック、およびそれがどのように機能するかについて簡単に見てみましょう。 効果的なタイポグラフィ サイトまたはアプリにおけるテキストの目的は、アプリとユーザーの間に明確なつながりを確立し、ユーザーが目標を達成できるようにすることです。そして、タイポグラフィはこのインタラクションにおいて重要な役割を果たしています。 テキストのサイズとレイアウトは、画面上でものを読むときの体験に大きな影響を与えます。小さな書体や狭い行間、余白の文字を処理
現役のデザイナーが語る！優秀なUI/UXデザイナーになるために不可欠なスキルとは | TechAcademyマガジン
現役のデザイナーが語る！優秀なUI/UXデザイナーに不可欠なスキルとは UI/UXデザイナーと聞くと、UIデザイナーとUXデザイナーはそれぞれ使えるツールが違い、求められることも違うことがあるでしょう。それでも優秀なデザイナーとして活躍するために必要な要素を紹介しています。これから目指す上でぜひご覧ください。 テックアカデミーマガジンは受講者数No.1のプログラミングスクール「テックアカデミー」が運営。初心者向けにプロが解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。 ※ アンケートモニター提供元：GMOリサーチ株式会社 調査期間：2021年8月12日～8月16日 調査対象：2020年8月以降にプログラミングスクールを受講した18～80歳の男女1,000名 調査手法：インターネット調査 本稿は、Designmodeのブログ記事を了解を得て日本語翻訳し掲載した記事になりま
2017年に人気となる、知っておきたいUIデザインのトレンド8個まとめ
アプリデザインのトレンドは絶えず変化しています。時間が経てば消えてしまうものから、成長し、進化を続けるものもあります。多くのトレンドは検討する価値がもちろんありますが、一緒に新しい技術も必要となります。 優れたUIデザインは、シンプルさ（英: Simplicity）と有効性（英: Effectiveness）が全てです。これこそがデザイナーが機能性を達成しようとする理由です。しかし反対に、もしユーザーがアプリをうまく使いこなせないとき、UIデザインは失敗と言えるでしょう。 デザイントレンドが変化する理由にはさまざまな要因が考えられます。たとえば2015年の大きな流れとして、ハードウェアの変化やモバイル端末のレスポンシブ化が挙げられます。 公開された多くのモバイルアプリは、人気のある機能を必需品としてすぐに変化させてきました。さらに今では若者のおよそ90%が、モバイル端末上で基本的な操作を行
Mobile Design Best Practices
Apps are now a mainstream, trusted way to deliver content and services. But in a crowded market, how does a mobile app become useful, relevant, and valued so it delights and retains users? Here are 7 UX design tips that I think are key for creating really great mobile user experiences. 1. One Screen, One Task Reduce the effort users have to put in to get what the want Every screen you design for t
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ノンデザイナーこそ絶対読みたいUI/UX関連の最新記事ベスト10
VC「もしかして...」Model「私たち...」「「入れ替わってるー！？」」を前前前世から防ぐ方法
