ありがちなプロトタイプ失敗パターン
次へ進むための『何か』 プロトタイプは今日の設計プロセスにおいて必須の役割を果たしている … といった論調を見かけることがあります。特にアプリの場合、Web サイト制作以上に開発者とデザイナーの密接なコミュニケーションが必要になるので、単なる静止画データの受け渡しでは不十分です。そこで「プロトタイプを作りましょう」となるわけですが、他のツールと同様、手法を取り入れただけで制作における課題が解決されることはごくまれです。 プロトタイプは、紙で作るものから、Principle のようなアプリケーションを使ってインタラクションを加えるものまであります。プロトタイプの完成度も制作スピードもツールによってまちまちなので、どのように扱えば良いのか迷う方も少なくありません。また、新しいツールを採用してプロトタイプ（のようなもの）を作ってみたけど、以前と状況が変わらないどころか、大変になってしまうこともあ
プロトタイプを使って要件をまとめるときに気をつけるべきこと
JoeはUX/CXコンサルタントとして長年のキャリアがあり、現在はUXに関する書籍、講演などを多数手がけるUXの伝道師です。 「要件を決めた時に想像していた仕様と違う」 開発チームのほとんどが、プロジェクトの中でも最悪のタイミングで、このような発言を聞くはめになります。大抵、このようなことが起きると、開発者は自分を正当化しようと怒り出します。正確に要件を定義していなかったとステークホルダーを叱責するのです。 これはもっともな怒りではあります。しかし、同時にこの状況の責任は私たち開発側にもあることも事実です。 私たちは認識のズレを埋めるため、要件に必要なことをステークホルダーに伝えてきれていません。この記事では、開発の現場で起きがちなことについて話していきます。 要件をまとめることの背景にある厳しい事実 要件が決められるのは、大抵ステークホルダーとのミーティングのときです。ステークホルダーは
必要な物は紙とペンだけ！ペーパープロトタイピングのススメ
まずは紙。家にあるチラシの裏の白い部分でも可能なのですが、方眼のものが製図しやすいです。お気に入りのノートを使ってみてください。後述するプロトタイプ制作ツールのMarvelから、無料のプロトタイピング用紙（PDF）が配布されているので、こちらを使ってみてもいいですね。 基本的にどんなペンでも構わないのですが、太いペン、細いペン、薄い色（灰色）のマーカーの3種類あれば文句なしです。マーカーはなんやかんやコピックが使いやすいのかなーと思います。 その他 紙とペンだけでOKですが、よく使うアイコンが手軽に描けるUI Stencilsという定規兼ステンシルがあると便利です。iPhone用ステンシルだけではなく、様々な種類が用意されているので、興味のある方はUI StencilsのWebサイトを覗いてみてくださいね。 ペーパープロトタイプの描き方 1. ざっくりとしたレイアウト組み まずは画面をレイ
UX課題を”つくる前”に改善！インド発の無料プロトタイピングツールが、人間の仕事を本気で奪いにきてる | Ledge.ai
TOP > Technology > 注目テクノロジー > UX課題を”つくる前”に改善！インド発の無料プロトタイピングツールが、人間の仕事を本気で奪いにきてる こんばんは、イイノです。 つい先日にはAdobeXdのプレビュー版がリリース。プロトタイプが本格的に現場に浸透するぞー！なんて、話題になってますが、個人的にはXdを超える？なんて思えるプロトタイピングツールを発見してしまったので、紹介してみようかなと。 これまでのプロトタイピングツールでは難しかった『複数人プロトタイピングでの挙動をトラッキング分析』や、『個別＆全体での行動をレポーティング』といった機能を搭載し、なんと無料で利用可能にしてしまったという衝撃のツール『CanvasFlip』。 インドの天才たちが作ってくれたこのツールで、プロトタイピングとユーザーテストの手順や手間やコスト、その他もろもろな常識が変わってしまう？…かも
無料で使えるモバイルアプリ制作用のプロトタイピングツール
2016年2月18日 スマートフォン, 便利ツール 以前「Webサイトのプロトタイプ制作に使える無料オンラインツール」というのを記事にしましたが、今回はモバイルアプリ制作に特化したツールを調査してみました。ただ、知らない間に便利ツールが増えまくり、あまりにも数が多いので無料で使えるものに絞り、さらに使ってみていいなと思ったものを集めました。それでも数が多いので…あとは実際にみなさんで試してみて、自分にあったものを探してみてください！ ↑私が10年以上利用している会計ソフト！ おすすめ無料プロトタイピングツール Marvel Marvel 無料プランでもプロジェクトを無制限に作成できちゃうプロトタイピングツール。ブラウザー上で編集していきます。リンク先となるページ画像がサムネイルで表示されていて、ページ推移時のアニメーションも分かりやすいです。コメント機能もあり。 完成したプロトタイプはUR
ペーパープロトタイピング入門 – 第1回 どうして紙でプロトを作るのか | fladdict
ペーパープロトタイピング講座シリーズ。第1回は導入編。 第1回はの導入編。ペーパー・プロトタイピングとは何なのか、何故必要なのか。そして導入することで、どんな利点があるのかを説明する。 ペーパー・プロトタイピングって何？ ペーパー・プロトタイピングとは、紙で実際にアプリやサイトを「実装する」ことである。 通常の開発においてコンテンツが使いやすいかどうかは、開発が終盤になるまでわからない。このため「作ってはみたが使いにくい」や「いまさら後戻りできない」という問題が発生する。UIや手触りが重要なモバイル系のアプリにおいて、これは致命的な問題になる。ペーパープロトタイピングはこの問題を低コストで解決する。 紙とペンで動作モックを作成することで、本実装を行う前に、素早く手戻なく検証を行うことができる。これにより、仕様書策定や実装前にPDCAのサイクルを実現できる。作業負荷の高い本実装を行う前に軽く
Archived MSDN and TechNet Blogs | Microsoft Docs
Archived MSDN and TechNet Blogs 2/7/2020 2 minutes to read MSDN and TechNet blog sites have been retired, and blog content has been migrated and archived here. Archived blogs are grouped alphabetically by the initial letter of the blog name. Blogs and blog posts can be searched by their names, using the Search box at the top of the page. Actively updated blogs have been moved to other blog sites,
IxEdit
IxEdit - The First On-the-Fly Interaction Design Tool for the Web. IxEdit (Public Beta) フリーダウンロード IxEdit は JavaScript ベースのウェブ用インタラクションデザインツールです。IxEdit を使えば、デザイナーはコーディング無しで DOM スクリプティングを実践し、ウェブページ上の要素をダイナミックに変更したり、追加したり、動かしたり、変形させたりすることができます。特に、IxEdit はウェブアプリケーションのプロトタイピング段階において様々なインタラクションを即座に作って試してみるのに役立つでしょう。 インタラクションとは？ インタラクションとは、ユーザーのアクションに応じてスクリーンの状態が変化することです。つまり、ユーザーインターフェースの振る舞いと言ってもよいでしょう。
セレナビジネスマッシュアップについて
Knowing what has changed in a software environment is as critical today as it was in 1980 when Serena began. From the very first product Comparex, to the Release Management and Deployment Automation solutions, Serena focused on managing every facet of IT change. These products are depended upon daily by global organizations to develop and deliver their critical business systems so they can “move f
Information Architecture Institute > Learning IA - Information Architecture Institute:
We’re currently in the process of migrating our library to the new Drupal system, but in the meantime we’ve made the content available via Google Documents. Our library is the largest expertly-curated, information architecture-specific library in the world, including articles, tools, templates, podcasts, and a full listing of all the books one could ever need to get to the next level of their IA p
第2回 ワイヤーフレームと設計ツール | gihyo.jp
前回、「IA One Sheeters」をご紹介しましたが、もちろんそれらを指してすべてが「IAタスクである」とは言い切れません。ただ少なからずIAというロール（役割）において関係してくるタスクであることは間違いないと思います。 そこで今回は、そのサンプルにもあった「ワイヤーフレーム」についてのツールを紹介します。 そもそも画面のレイアウトおよび原稿の整理という意味では、いろいろなツールが関係してきます。Web制作の現場においてはWebデザイナーやWebディレクターというロールが関わり、タスクベースにするとどのロールがそのタスクを遂行するのかが混乱しがちです。この連載ではWebデザイナーを対象として、ツールの使い方やぶつかる課題にフォーカスをあててみたいと思います。 ワイヤーフレームについて ワイヤー（線形状）でフレーム（枠）にしていくことから名前がついたと思われますが、もともとはCG（
PowerPoint Prototyping Toolkit (release 0.2)
After hearing about the impact and success it had in Microsoft, I couldn’t wait to get my hands on prototyping in PowerPoint 2007. Amongst a few things Manuel Clement suggested a few weeks ago in his presentation about “wireframe prototyping with Office PowerPoint 2007”, was to create a toolkit of commonly used GUI components to copy and paste when designing the prototype screens. That’s what I se
マイブログ
ロングカーディガンが流行ってるみたいですよ。 最近、ゆるいファッションというのが定番になっていて、 チュニックでもなんでもゆったりしたシルエットの ファッションアイテムが多いですが、 その流れなんでしょうか。 でも、注意しておかないといけないのは、 「だらけた」感じにならないことです。 ゆるりとしたシルエットながらもおしゃれには気を抜いていない、 そんなコーディネートが望まれます。 ロングカーディガンでは、fluxusなんかが流行ってるみたいですね。 ミーガン・フォックスとか、アマンダ・バインズとか、 セレブも愛用しているおしゃれブランドです。 ロサンゼルス発のブランドですね。 このロングカーディガンを見てみても、 ウエストのラインとかゆったりしていて、 サイドに大きなポケットがついていて、いかにもゆるいファッション、 という風に見えますが、着てみるとゼンゼン違います。 ボタンをはずして着
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://dandkagency.com/extensions/velositey-v2/
Adobe Fireworks CS4 * Web サイトとアプリケーションインターフェイスのプロトタイプ作成
Balsamiq. Rapid, effective and fun wireframing software. | Balsamiq
iPlotz: wireframing, mockups and prototyping for websites and applications
Online Diagram Software - Gliffy
IDEA * IDEA
ウェブの画面設計に使えるまとめ - DesignWalker
