GUIの“こちら側”からのデザイン / Designing GUI Face and FaceGUIの“こちら側”からのデザイン（公開版） GUIの表現方法ではなく、ユーザーの操作方法やイベントディスパッチの構造に着目してmacOSネイティブインターフェイスのデザインを考えます。CocoaにおけるResponder Chainの仕組みやUIの表現に触れつつ、macOS “らしい” GUIの…
「AbemaTV」におけるSketchとAbstractの運用フロー | CyberAgent Developers Blog
AbemaTVの開発組織では、UIデザインツールはSketchとAbstractを使用しています。 今回は2018年11月現在での運用方法について紹介したいと思います。 Sketchは言わずと知れたUIデザインに特化したツールです。 様々なデザインツールがありますが、複数人での共同作業やバージョン管理をする際には、SketchとあわせてAbstractを導入する組織も多いのではないでしょうか。 私たちは、2017年12月にAbstractを導入する以前はGitHubやGoogleDriveでSketchデータを管理していました。 しかし、それらのツールは「デザイン作業」に特化しておらず、どうしても痒いところに手が届かない状態でした。 AbemaTVには現在6人のUIデザイナーがおり、マルチデバイスへの対応のため多くのSketchファイルを運用しています。 ・モバイルアプリのiOS・Andr
「次のモバイルファースト」がやってくる！UIと機能設計をIonic 2を使って学んでみよう
「次のモバイルファースト」がやってくる！UIと機能設計をIonic 2を使って学んでみよう 榊原昌彦（一般社団法人リレーションデザイン研究所 ...） レスポンシブデザインが生まれたばかりの2009年には、はやくも「モバイルファースト」という言葉が使われ始めていました。 WebサイトはPCから見るものだったのは今や昔。今ではスマートフォンの普及により、多くのWebサイトではPCとモバイルからのアクセス数が逆転してるWebサイトも多く、「モバイルファースト」な開発も当たり前になりました。 しかし、2009年の「モバイルファースト」と、今の「モバイルファースト」は大きく中身が成長しました。モバイルフレームワークであるIonic 2も先日リリースされましたので、ここで改めて「モバイルファースト」とは何かを考え、モバイルの設計を見直していきます。 レスポンシブとモバイルファースト モバイルファース
ハンバーガーメニューはもう古い！代わりに使えるモバイル用ナビメニュー5つまとめ
ウェブサイトを制作しているひとなら、モバイル端末におけるハンバーガー型ナビゲーションメニューの見つけにくさと効率の悪さ、またどれだけUXデザインの邪魔になっているのか、いくつもの記事を読んだことがあるでしょう。（この問題の参考にしたい記事はこちらやこちら、こちら、こちらからどうぞ。） 幸いにも多くのサイトやアプリで、より効率的な解決法となる代替アイデアが試されています。今回紹介しているアイデアは、他のものより優れているというわけでなく、コンテンツや内容によってパフォーマンスや実行できるかどうかは変わってきます。 01. タブ型ナビゲーションメニュー もしウェブサイトやアプリの項目が限られている場合、ユーザーはできるだけ素早くそカテゴリを切り替えたいところ。そんなときは、タブ型ナビゲーションが良い解決方法となるでしょう。 タブはもっともシンプルなナビゲーションパターンですが、デザインを制作す
ペンとふせんで！スマホUIのアイデアプロトタイピング - クックパッド開発者ブログ
検索事業部のデザイナー倉光です。 今回は、開発現場でアイデア発散フェーズにやっていることの一例を紹介したいと思います。UIデザインの手法として比較的知名度は高く、デザイナー以外でも学びたいという要望も多い「ペーパープロトタイピング」についてです。 前提として プロトタイピングにはフェーズと目的に応じて 様々な手法がありますが、今回は「小規模チームでアイデアをぽんぽん出し、伝え合うためのプロトタイピング」の話です。ユーザーに実際に評価してもらうためのプロトタイプの作り方についてはこの記事では割愛させていただきます。 また非デザイナーの方は「いやいや、デザイナーじゃないと画面なんてうまく書けないよ…」と躊躇してしまうかもしれませんが、本記事では社内のディレクター/エンジニア/インターン生が書いた成果物も掲載していますので、そちらも参考になると思います。 目次 目次 1.ペーパープロトタイピング
モバイルWebのUIを速くする基本テクニックがわかる──Google I/O 2016 High Performance Web UI
モバイルWebのUIを速くする基本テクニックがわかる──Google I/O 2016 High Performance Web UI 川田寛（ピクシブ株式会社） こんにちは、ふろしきです！ 私はHTML5 Experts.jpで、過去2年ほどGoogle I/Oの情報を発信し、Web技術の変化についてお伝えしてきました。振り返るとGoogleは、2014年にモバイルWebの提唱と技術要素の拡大を図り、2015年からは「RAIL（モバイルWebが目指すべきパフォーマンス指標）」や「Progressive Web Apps（アプリのように振る舞うWeb）」といった、モバイルとの親和性が高いWebを作り出すための”考え方”を推し進めました。今年2016年は、さらにそれを踏み込んでいったという感じがします。 今回のI/Oで取り上げるのもそのひとつ。毎度お馴染みGoogle Developer A
UIデザイナーに必要なのは、決定力のあるデザインを作る能力 | tsublog
最近、デザイナーに求められるスキルが多くて何を学べば良いかわからなくなってきた。と言う声を聞くようになってきた。 流行りの記事にいくつか目を通すと、デザイナーは「 経営者と対等に話せるコミュニケーション能力、ビジネスセンスを保有していて、イケてるグラフィックを作り、コードまでかけないといけない 」らしい。 スキルを多く保有している方が望ましいのは間違いない。 ただ、 現場デザイナー に最も大事なのは実装面での考慮事項が網羅されて考え込まれた「 決定力のあるデザイン 」を作る力だと思う。 サッカーで言うと、決定力は「 得点を決める能力 」として使われているけど、UIデザインにおいては「 実装面まで考慮された実装可能なデザインであるか 」という言葉として使っている。 魅せるデザインとフィージビリティが考慮されているデザインでは、かなり内容が異なってくるので、現場デザイナーとしては特にこのあたり
確実に良くするUI/UX設計
日経電子版のリニューアルで、コンセプトモデル設計とプロダクト監修をさせていただいた。 超大型アプリを完全リニューアルするとき、KPIを落とす事なく、どのように整合性やユーザー利便性を担保していくか。 「日経電子版×Sansanアプリ開発プロジェクト成功への道〜アプリ開発者勉強会Vol.2」より http://connpass.com/event/16187/
モバイル向けUI/UXデザイン10のポイント デザイン会社 ビートラックス: ブログ
日々めまぐるしく変化するモバイルマーケットにおいて、マートフォンアプリやモバイルWebのUIやUXを最適にデザインする事はそのプロダクトがヒットするかの大きな要素となっている。特に最近は見た目が良いだけではなく操作性が非常に高いモバイルサービスが次々とリリースされユーザーが求めるクオリティレベルも上がっている。 小さな画面サイズ、様々な利用シーン、複雑な仕様の機能を実装したモバイルサービスにおいては、高いユーザビリティを実現する事が何よりも重要である。よりユーザーに愛される為もポイントをまとめてみた。 1. レイヤースタイルのUIで奥行きを出す モバイルのインターフェイスに関しては、最近のトレンドを見てみると、フラットなUIがトレンドのように思えるが、実はモバイルの限られたスペースでユーザーに効果的なエクスペリエンスを提供するには、縦と横のスペースに加え、”深さ”を利用したレイヤースタイル
UIの学習のために生まれたUI | UXデザイン会社Standardのブログ
UIには本来のサービスが成り立つ上で必要な機能に基づいた必須UIの他に、その必要機能についてユーザーに学んでもらうための学習用UIというものが存在します。本来であればサービスに必要なのは必須UIのみだったはずですが、リリース後やリリース前の段階においてユーザビリティテストを行なった結果があまり良くないのであれば改善をすることになります。しかし、UIのどこに課題があるのかの分析と改善には時間がかかり、実装などでも工数が発生することも考えると、より少ない手間で解決する方法が望まれます。今回は、このようなユーザビリティ上の課題を解決するために生まれた学習用UIのパターンをご紹介します。 参考：モバイルデザインパターン 第2版 ―ユーザーインタフェースのためのパターン集 使い方を学習するためのUIパターン もし新規のユーザーがサービスのコア機能の使い方がわからなければ、サービス自体を利用してくれな
ほんとに使える「ユーザビリティ」 : could
ユーザビリティ本 ほんとに使える「ユーザビリティ」 「使いやすさ」という考えが異なるだけでなく、「明快さ」の表現も異なる日本。海の向こうの人々が考える理想を、そのまま押し付けるのではなく、本書から何を抜き取り、自分たちの仕事に合うように変形させるのかが課題です エリック・ライス氏が 2012 年に刊行した「Usable Usability」の訳書です。 この種類の専門書は原書で読むことが多いので、久しぶりの訳書になりました。訳書の魅力は、日本語で読めるのはもちろん、原作者の住んでいる国の文化やニュアンスを理解していないと、伝わり難い部分を補っているところです。世界中を飛び回っているライス氏なので、世界のユーザビリティに興味をもつ読者に向けて執筆しているはずです。しかし、それでも『日本から』という視点では見え難いこと、分かり難いことは少なくありません。そこを、訳者 浅野紀予 さんは工夫されて
Androidアプリのあれがやりたい
WebGL Tokyo Meet upで話したスライドです。 WebGLのセットアップからGLSLなどの、Hello Worldをざっくりと解説しています。
伊藤直也氏が語る、モバイルアプリケーション開発のいまとこれから（前編）～Salesforce Developer Conference Tokyo 2013
伊藤直也氏が語る、モバイルアプリケーション開発のいまとこれから（前編）～Salesforce Developer Conference Tokyo 2013 いま多くの開発者が取り組もうとしているモバイルアプリケーションの開発は、経験の面でも技術の面でも、コンシューマ向けの開発現場が大きく先行しています。 9月6日開催されたSalesforce Developer Conference Tokyo 2013のセッション「B2Cからみたモバイルアプリケーション開発のいまとこれから」では、コンシューマ向けサービス開発の現場に身を置いてきた伊藤直也氏が、モバイルアプリケーション開発を成功させるための方法を、これまでの経験や現在の開発現場で得たノウハウなどを基に語っています。 試行錯誤の回数を増やす、iOSとAndroidは同じように作ってはいけないなど、モバイルアプリケーション開発に関わるエンジ
パルシステムのWeb注文システムがとても良くなって、素晴らしいと思っています。 - あったらしくるえるはてなくしょん
Web関連ということで同業だから、なおさら気になるのかもしれませんが...。 うちでは、以前も書いたことあるのですが、Webで食材注文できるサービスが好きで、最終的に、東都生協とパルシステムの生協ツートップがレギュラーになりました。 今、生協をふたつ活用してる形で、もう2年くらいかな、ずっと併用でやってます。他にもらでぃっしゅぼーやとか、大地を守る会とかOisixとか、あるんですけど、ずっと使うには私の収入がうっ...苦しい... みたいになります...ははは orz。 それで、パルでは、牛乳と乳製品と調味料とか買って、たまに冷凍食品も買うとかで、基本的にパル名義のものばかり買います。東都生協では、野菜と果物と、たまに何か思いついて他も買うとかで、だいたい産直名義のものを買って推移してます。双方で安くて良いのを選抜したらだいたいそうなりました。 Web の注文画面の出来が、ずいぶんよくなっ
ScaleOut | Supership
2024年4月1日より、Supership株式会社は親会社であるSupershipホールディングス株式会社に吸収合併されました。 合併に伴い、存続会社であるSupershipホールディングスは社名をSupershipに変更し、新たな経営体制を発足しました。本件に関する詳細は、プレスリリースをご確認ください。 2024年4月1日より、Supership株式会社は親会社であるSupershipホールディングス株式会社に吸収合併されました。 合併に伴い、存続会社であるSupershipホールディングスは社名をSupershipに変更し、新たな経営体制を発足しました。 本件に関する詳細は、プレスリリースをご確認ください。
スマホUI考（番外編） なぜ機能追加をし続けるとアプリが破綻するのか？ | fladdict
この写真は、アーミーナイフの名門ウェンガー社のジャイアントナイフという最高級ナイフである。141の機能を持つ、ギネス認定もされた厚さ24cm、重量1.3kgの世界で最も高機能なナイフだ。トップメーカーが自社製品の全機能を１つに集約したこの製品こそが、機能拡張の行き着く先を指し示している。 なぜ適切な機能追加であっても、機能を追加しつづけることで破綻をするのか？本エントリは、「スマホUI考（番外編） 顧客やユーザーの要望に全て対応すると、アプリは99%破綻する」の続きになる。 本エントリでは以下の４つの側面から、機能を追加するリスクを考える。まず第一に「選択肢の数が必ずしも善ではないこと」。次に「人間の判断力は使うほど消耗すること」。そして「画面スペースが有限のリソースであること」。最後に「どんなに機能を増やしても、一画面で強調できるものは限られていること」。これらの４つは全て、機能追加が最
これからのUIデザインのために、デザインカンプをやめてプロトタイプを作ろう（前編） | Goodpatch Blog
先日、長谷川恭久さんとの共同プロジェクト、“Patch Project”がスタートしました。これはUIデザインの新しいワークフローを作るために立ち上がったプロジェクトです。これまでのワークフローを見直して、より良いUIを作っていくためにはどうするべきなのか、実際に何かのUIをデザインしながら模索していきます。そのプロセスや結果はどんどんオープンにしていきますのでお楽しみに！ まず今回はその導入部分として、ワークフローの提案について長谷川さんに話して頂いた内容を記事にしました。前編では、デザインカンプをやめてプロトタイプを作るべき理由を中心にまとめています。 そもそもUIとは何か UIの話というと多くの人がビジュアルデザインの話をしますが、そもそもUIとは人間とコンピュータの関係を円滑にするためのものです。人がコンピュータと関わるとき、そこには必ずインプットとアウトプットがあります。その中で
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
iOS Human Interface Guidelines：Designing for iOS （日本語）
PC、スマホの「次」のデヴァイス：MITメディアラボが描くインターフェイス研究の最前線
http://jp.startup-dating.com/2012/05/interview_ikumikatayama
