webサイトのモックアップで意気揚々とユーザーテストした結果、白目を剥きました。テスト結果と考察、改善方法｜山崎あやな
webサイトのモックアップで意気揚々とユーザーテストした結果、白目を剥きました。テスト結果と考察、改善方法 初めまして。かけだしUIデザイナーのガラナです。プライベートでE2D3のwebサイトをデザイン中です。 【E2D3とは】Excelのデータから、インタラクティブなグラフを作成できる無料アドインソフト。有志が非営利に開発中。E2D3メンバーにより、講演会やもくもく会などのイベントも定期的に開催されている。 sketchとFlintoでwebサイトのモックアップを作成し、意気揚々とユーザーテストした結果、フルボッコになったお話。テスト結果と、考察、改良点をまとめました。 現状のサイトの構成と各要素の目標はこんな感じです。 「2. E2D3概要、3. プロダクトの一部お試し、4. プロダクト詳細」できちんとコミュニケーションが取れるかどうかが肝です。 今回は「E2D3とは何かがきちんと伝わ
note ――つくる、つながる、とどける。
1203本 思想を持ったお店をつくったり、運営、デザインをしているひとやその感想などの記事をまとめるマガジンです。
ペンとふせんで！スマホUIのアイデアプロトタイピング - クックパッド開発者ブログ
検索事業部のデザイナー倉光です。 今回は、開発現場でアイデア発散フェーズにやっていることの一例を紹介したいと思います。UIデザインの手法として比較的知名度は高く、デザイナー以外でも学びたいという要望も多い「ペーパープロトタイピング」についてです。 前提として プロトタイピングにはフェーズと目的に応じて 様々な手法がありますが、今回は「小規模チームでアイデアをぽんぽん出し、伝え合うためのプロトタイピング」の話です。ユーザーに実際に評価してもらうためのプロトタイプの作り方についてはこの記事では割愛させていただきます。 また非デザイナーの方は「いやいや、デザイナーじゃないと画面なんてうまく書けないよ…」と躊躇してしまうかもしれませんが、本記事では社内のディレクター/エンジニア/インターン生が書いた成果物も掲載していますので、そちらも参考になると思います。 目次 目次 1.ペーパープロトタイピング
UI/UXデザインは「プロトタイプがないと話にならない」- 「Adobe XD」を使った"最強のデザイン手法"
アドビ システムズ主催のクリエイター向けイベント「Adobe MAX Japan 2016」が9月2日、開催された。 これは、米サンディエゴで行われている本家イベント「Adobe MAX」を日本のユーザー向けに開催するもの。イベント当日は多種多様なセミナーが行われたが、本稿では「プロトタイプで舵を取れ！Adobe XDを使った最強のUI/UXデザイン手法」と題して行われたセッションの模様をお届けする。 "ハードルは高くスケジュールは短い"Webの現場 同セッションのスピーカーは、ビジネス・アーキテクツのデザイナーの荒木脩人氏。荒木氏が所属するビジネス・アーキテクツは、ウェブサイトの構築を中心に、コンテンツ開発からデータ解析、調査、分析、最適化まで行うデザイン会社。じぶん銀行や森ビル・六本木ヒルズのウェブサイトやauもモバイルサービスアプリなどが代表的な作品だ。 そんな中、2012年に同社に
iPad ProでUIスケッチできるアプリBluprint をリリースしました
UXデザイナーのiPad Proレビュー記事で、UIのスケッチにいいと。僕自身もスケッチが大好きなので、ものすごく欲しくなって。この記事に挙げられているのが『純正メモ』と『Adobe Comp』なんですけれども、Compは機能が中途半端で、僕はこれを使うならSketchでいいんじゃないか？と感じたので、純正メモでスケッチをしてみました。カメラでいちいち撮影したり消しカスに悩まされることがなくなり、確かに圧倒的に紙より捗るものの、幾つか問題がありました。 Notesアプリで描いたスケッチ毎回画面のスクウェアを描くのが面倒スクウェアは勘で描くので、サイズがiPhoneと同じにならないもちろん解像度もiPhoneと全く異なるアイコンなどを何回も描かなくてはならないMacに転送した場合、画像をトリミングしてからでないとInVisionなどのプロトタイピングサービスに配置できない1画面に2〜3個しか
UIデザインの面倒な部分を自動化！ラクしてプロトタイプが作れる「Adobe XD」のメリット/デメリット｜dwango creators' blog（ドワンゴクリエイターズブログ）
こうしてまとめてみると、PhotoshopよりIllustrator寄りの機能になっているような気がします。 デザインモードはここが便利！ すごい数のアートボードになっても重くならない 公式の紹介動画をみていた際、アートボードの数が増えてもパフォーマンスが落ちないという解説がありました。 あやしい… というわけで、試しに50ほどアートボードを並べて可愛い柴犬で画面を埋めてみました。 この状態で編集や移動、拡縮を繰り返しても重い印象はなくスムーズ。 PhotoshopやIllustratorだと、10前後でじわじわ重くなってきてヒーッ！となっていたのですが、それに比べれば断然スムーズです。 疑ってすみませんでした！ ただ、まだ機能が少ない分軽い可能性も。 今後バージョンアップしても変わらないことを祈ります。 画像のマスクや差し替えが簡単すぎる Adobe XDでは、とても簡単に画像のマスクや
UX課題を”つくる前”に改善！インド発の無料プロトタイピングツールが、人間の仕事を本気で奪いにきてる | Ledge.ai
TOP > Technology > 注目テクノロジー > UX課題を”つくる前”に改善！インド発の無料プロトタイピングツールが、人間の仕事を本気で奪いにきてる こんばんは、イイノです。 つい先日にはAdobeXdのプレビュー版がリリース。プロトタイプが本格的に現場に浸透するぞー！なんて、話題になってますが、個人的にはXdを超える？なんて思えるプロトタイピングツールを発見してしまったので、紹介してみようかなと。 これまでのプロトタイピングツールでは難しかった『複数人プロトタイピングでの挙動をトラッキング分析』や、『個別＆全体での行動をレポーティング』といった機能を搭載し、なんと無料で利用可能にしてしまったという衝撃のツール『CanvasFlip』。 インドの天才たちが作ってくれたこのツールで、プロトタイピングとユーザーテストの手順や手間やコスト、その他もろもろな常識が変わってしまう？…かも
どのようにして高速に iOS アプリの UI を作り上げるか：動作モックの活用と実装時の UI 作りこみ - クックパッド開発者ブログ
Holiday デザイナーの多田です。 皆さんは Web アプリやモバイルアプリを開発する時、モックアップ作成にどれだけ時間を割いているでしょうか？もしくはモックアップを作成せずにすぐに実装に入るでしょうか？私はこれまで Web アプリ開発ではいきなり実装に入ることが多かったのですが、Holiday iOS アプリ の開発では Web アプリの時のように上手くいかないことに気づき、やり方を考え直しました。iOS アプリ開発の過程で、モックアップ作成や実装をどのように捉えるか、具体的にどう行うか、ということが自分なりに見えてきたので、それらについてご紹介します。 目的は、価値のあるプロダクトを速くユーザの手に届けること Web アプリやモバイルアプリの開発過程においてモックアップなどを作る目的は、あくまでも ユーザに届く プロダクトの価値を高めてそれを速くリリースすることです。適切な前準備は
F8で発表されたプロトタイピングツール Origami Studioの気になる機能いくつか - よりぶろ
Facebookの開発者向けイベントF8でOrigami Studioが発表されましたので、ビデオの中から気になった機能をざっとまとめてみました。 Rapid Prototyping Made Easy with Origami Studio - Videos - 開発者向けFacebook ちなみに年内には無料でリリースされるようです。楽しみ〜！ ページのスクロール 複数のスクリーンを1つのフォルダにまとめて、それに対してScroll Xを適用。スクロールのタイプをPageにすることで、区切られたスクロールが可能。 Alert Viewがめっちゃ簡単に追加できる 中の文言も編集できます Screen Transition パッチ Origamiの鬼門だった画面遷移が作りやすくなってる。これは嬉しい。 Grid / Listのループ Adobe XDと似てますな という感じで、他にも紹介が
Prottとsketchとzeplinのススメ
書籍化し、12万部突破しました。 【SlideShare広告回避用】 https://www.docswell.com/s/morishige/K3MXPZ-howtodesignslides ・PDFは無料でダウンロードできます ・自己学習や勉強会などの目的でしたらご自由にお使いいただけます ・授業・研修への利用はフォーム( https://forms.gle/WwgXTT974xFW78mFA )にご報告ください ・記事への参考資料にする際は適切な出典明記をお願いいたします 【使っているフォントについて】 M+フォント「MigMix1P」です。こちらもメイリオ同様おすすめです。 フリーで使えます。 【個人HP】 > https://mocks.jp > 仕事のご依頼はこちらから 【書籍情報】 デザイン入門：https://amzn.asia/d/4WDsTI6 デザイン図鑑：https
「UIデザインは誰のもの？」について話したこと - Pepabo Tech Portal
はじめまして。ハンドメイドマーケット minneでアプリのUIデザインをしている@naomeme です。 先日プロトタイピングツールProttのイベントで「UIデザインは誰のもの？」というテーマで発表したので、そのことを書きます。 発表したイベントについて 発表したのはPrott User Meetup vol.11 -Google Playベストアプリ特集-というイベント。Prottのヘビーユーザーから「実はあまり知らない…」という人まで、業種もさまざまな人が集まります。毎月開催されていて、気軽に参加できる雰囲気だったのでUIデザインに興味のある方はぜひ。 Prottってなに？という人のために。 Prottは誰でも簡単に、すばやくプロトタイプを作ることができる便利なツールです。現在たくさんのプロトタイピングツールがありますが、その中でもProttはチームでコミュニケーションしながらUIデ
「インプットを伴わない直感の判断は信じない」日経電子版 × Sansan × @fladdict | キャリアハック（CAREER HACK）
日経電子版と名刺管理アプリ「Eight」を提供するSansan社のコラボ勉強会「アプリ開発勉強会」のレポート第2弾。今回はモバイルアプリで重要な「UI/UX開発」がテーマ。会場にはアプリ開発に携わるエンジニアを中心に、WEBデザイナー、情報システム担当者、サービス企画担当者など幅広い層のオーディエンスが集まった。 悩むことは悪じゃない、悩み続けることが悪！ 最初のトークセッションはSansan株式会社プロダクトマネージャー 廣瀬拓郎氏。 スマホアプリのデザインを内製化したのは1年前。当初アサインされた2名のスタッフはUIデザイン経験がほとんどゼロの状態からのスタートだったという。 「デザイン会社が作ってくれた初版のデザインから、UI/UXの細かいブラッシュアップをたくさんしてきたが、まだ全然やりきれてはいません。今日はどのように当社がUIに関する引き出しを増やし、UIを考える訓練をしてきた
確実に良くするUI/UX設計
日経電子版のリニューアルで、コンセプトモデル設計とプロダクト監修をさせていただいた。 超大型アプリを完全リニューアルするとき、KPIを落とす事なく、どのように整合性やユーザー利便性を担保していくか。 「日経電子版×Sansanアプリ開発プロジェクト成功への道〜アプリ開発者勉強会Vol.2」より http://connpass.com/event/16187/
「ぶっちゃけ感」とバリエーションが魅力のUI/UX勉強会！第57回 HTML5とか勉強会レポート
「ぶっちゃけ感」とバリエーションが魅力のUI/UX勉強会！第57回 HTML5とか勉強会レポート 白石 俊平（HTML5 Experts.jp編集長） こんにちは、編集長の白石です。 2015年5月20日、第57回 HTML5とか勉強会「UI/UX」に参加してきました！簡単で恐縮ですが、レポートとまとめをお届けします。 チームでつくるUIデザイン 最初のセッションは、Goodpatch社の小島芳樹さん、ひらいさだあきさんによる「チームでつくるUIデザイン」です。 彼らが日々の業務で実践している、UIデザインやプロトタイピングについてのTipsが紹介されました。 チームでつくるUIデザイン マシュマロ・チャレンジで理解する、プロトタイピングの重要性 まずはマシュマロ・チャレンジというワークショップについて、TEDで動画が公開されているプレゼンテーションを引き合いに出しつつ、プロトタイピングの
デザインスプリントとPocketのプロトタイピング（翻訳）
本記事は、ブックマークサービスPocketが行ったデザインスプリントについての翻訳記事である。（オリジナル）。デザインスプリントとは、Googleの投資部門Google Venturesが投資先に行うデザインワークショップ。 Pocketの新規ユーザーにむけて、よりよいエクスペリエンスをデザインするお手伝いしました。 結果、新規ユーザーが最初のアイテムを保存する率が58%増加し、より高いアクティブ率とアクティブユーザーを生み出しました。 チャレンジ 新規ユーザーがアクティブユーザーになるための手伝いをする。多くの人々がPocketをダウンロードしサインアップするが、チームは彼らがよりアクティブな長期ユーザーになりやすくしたかった。 私たちのしたこと ポケットチームと3週間にわたり3回のデザインスプリントを行いました。彼らのiOSとAndroidアプリのために、新しいGetting Star
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
kobit.in
デザインと技術をつなぐ / Connecting Design and Technology
モバイルアプリのUIデザインの参考になるスライド10選
神アップデート！プロトタイピングツール「Prott」のワイヤーフレーム機能がめっちゃ良い！｜男子ハック
開発者とデザイナーのコミュニケーションを劇的に改善したい！ UIデザイナー発「プロトタイピング開発」のススメ
