ico_gvoice

Prototype can make things happen

この文章を読むまで、多くのideaが開発されていないか、開発に協力してくれるチームのリソースがないということはありませんか。 

ひとつ教えましょう。Prototype(原型)はMake things happenを実現するツールです。これはどういうことでしょうか?

有名なAppクリエイター(Instagram、Yipit、Odopod、POPなどを創造した会社)はいずれも低コストでスピーディーなプロトタイプデザインツールを最初に使用してクライアントに提案したり、デザイナーやプログラマーと意思の疎通を行ったり、ユーザーにユーザーエクスペリエンス(User experience, UX)について実際にテストしてもらったり、フィードバックに耳を傾けるなどします。ポイントは製品を徐々にユーザーが期待するものに近づけることにあります。

 

プロトタイプがこんなにすごいなら、なぜ誰も常に使用しないのでしょうか。実は、プロトタイプを作成する過程では誰もがプロトタイプに対して次にあげるいくつかの思い込みがあり、多くのアイデアを持っているクリエイターが遅々としてプロトタイプを製品の開発に役立てようとしたがらないのです。この文章を通じてビジョンとアイデアを持っている人が簡単に実際に作ってみることを願っています。

 
 
思い込み1:プロトタイプは全ての機能がきちんとデザインされているようでなければならない。
正しい思考:全てのインターフェースと機能を完全に考え付いてから作成を始める必要はありません。アイデアがあれば、すぐに作成を始めてかまいません。

Instagramの早期のバージョンでは、友人が加入した時に注意を促すという機能の追加が考慮されていました。Instagramの創始者Kriegerはこの機能を直接作ってテストせず、人手による方法でユーザーに通知を送信したのです。その結果会員の反応はよいものではなかったため、この機能を作ることはありませんでした。「私たちは1行のコードも書いていません。だから1行のコードも削除する必要はありませんでした。」プロトタイプの目的は「デザインの問題の解決」、「デザインのアイデアの評価」、「デザインのアイデアの伝達」であり、限られた時間と行動力、予算の中で構想を形にして良いか悪いかのフィードバックを獲得してから次のステップに進むことを決定するものです。

▲プロトタイプではデザインプランと仮説を提出し続けて、潜在的ユーザーに実際にテストしてもらうことによってユーザーのフィードバックと経験を聞き取り、開発中の製品をユーザーの仕様体験と期待に合致するよう発展させていく。

 
 
思い込み2:デザイナーではないから、素晴らしいプロトタイプは作れない。
正しい思考:デザイナーのテクニックが無くても簡単なデザインツールを利用できる。

プロトタイプは芸術品を生み出すことではありません。プロトタイプ作成の鍵は「ある物から選ぶ」、「使えればOK」です。Instagramのもう一人の創始者Systromは常にiPhoneのデザインボール紙をもってカフェに座りながらどの機能を残し、どれを削除するかを一緒に話し合っていました。プロトタイプを作成するツールにはPost-it、ペーパーモデル、PowerPoint(PPT)やKeynoteプレゼンテーションツール、Googleグラフィックツール、関連アプリケーションからPhotoshop+インタラクティブプログラムなどに至るまで様々な種類があります。どのツールを使用して作成するにせよ、プロトタイプの目的はアイデアを素早く具現化するためのツールなのです。

 

簡単で操作しやすく、しかも無料のツールを紹介します。

名称

紹介

ダウンロード

ワイヤフレーム・テンプレート(Free)

iphone, ipad, mac Browserのワイヤーフレームテンプレートがダウンロード可。

 

http://mrare.ca/blog/iphone-ipad-and-browser-wireframe-templates

Prototyper (Free
(PC版)

iphone, Androidコンポーネントを内蔵。各ページのリンクを簡単に設定。


http://www.justinmind.com/prototyper/download

UIDesigner (Free)
(PC版)

iphoneコンポーネントを内蔵。Iconコンポーネントを自ら組み立てることが可能。各ページのリンクを簡単に設定。

 

http://uid.cdc.tencent.com/

POP(Free)
for iOS

手描きグラフィックを迅速にiphone内にインポートしてシミュレーションが可能。

 

https://itunes.apple.com/tw/app/pop-prototyping-on-paper/id555647796?mt=8

 
 
 
思い込み3:Prototypeインタラクティブな効果は表現できない。
正しい思考:ちょっとした工夫でプロトタイプにインタラクティブ効果をもたらすことが可能。
 
本当のところ、iPhoneやiPadのフリックなどのやり取りをプロトタイプで表現することは難しいのです。例えばズーム、スクロールなどの使用について正確にシミュレートすることは大変難しいことです。しかしほとんどのウェブサイト、ソフトウェアまたはAppの操作とインタラクティブデザインは、まだクリックを主としたアクションです。これらの操作の状況はプロトタイプソフトウェアツールでシミュレートできます。製品のフリックとインタラクティブ効果の感覚をテストしたい時は、ペーパー・プロトタイピングの方法で動態シミュレーションを完成させます。次のビデオでペーパー・プロトタイピングの効果を表現しています。
 
 
Video Prototype: Touchscreen Digital Camera
 
 
 
思い込み4:プロトタイプはプロフェッショナルではない感じがする。
正しい思考:ユーザーが使用状況に溶けこんでいる時はプロフェッショナルではない感覚にはならない。
 

以前プロトタイプを使ってテストをした時、プロトタイプであると聞いたり、見たりしたユーザーの表情にはプロフェッショナルではないという感覚が現れていました。しかし、テストの過程でユーザーはすぐに使用状況に溶けこみ、脳の中には多くの画面やアイデアが起こり始め、多くの経験とデザインのフィードバックを与えてくれるので、プロトタイプはプロフェッショナル的感覚に乏しいと心配する必要はありません。

 
 
思い込み5:プロトタイプは会議やテストが終わったら捨ててもよい。
正しい思考:プロトタイプの全てのバージョンはいずれも次のデザインへの道筋。
 
プロトタイプを上司や開発スタッフに見せたり、ユーザーテストを行うたびに、製品発表会のように会議を終えたらそれでおしまいというのではなく、毎回の議論、フィードバックとアドバイスの記録を続けると、毎回の変更の過程を一目で追跡でき、製品開発スタッフがいつまでも古い問題で堂々巡りすることが少なくなります。

▲それぞれのプロトタイプのバージョンと毎回のフィードバックの情報は全て記録しておくこと!

 

最後にPrototype can make things happenのキーポイントをまとめると、プロトタイプは迅速に低コストでアイデアを具現化し、上司やユーザーたちを招いて自ら操作してもらうことによって使用する体験を感じてもらい、開発チームのビジネスニーズと試用ニーズの模索に役立ち、リソースを有効に利用して製品の発展方向を迅速に推進させるものです。最後にひとつ、皆さんがプロトタイプを作成する際は上記の思い込みをしっかり覚えておいてください。

 
 
 
 
参考資料:
(1) Advice I Wish I Could Have Given Myself 5 Years Ago
 
(2) Prototyping iOS Apps with Storyboards
 
————-
 

作者紹介

ガマニアエルゴノミックデザインセンター / T-T Yang

ユーザーを中心とするUCD( User-Centered Design )デザイン方法で、グループの各プロジェクトにおける実施や改良に運用し、ガマニアの自社製品において最良のユーザーエクスペリエンスを提供することを推進し、また力を入れている。

 
————–
 
Read more
2020.04.01

Q Brick X Nic Hsu “A little surreal, a bit out of the daily life” of Retired Nutcracker Soldier

▲ Nic Hsu on the London's streets  Article | Mei-Ling Liu Photo | Nic Hsu

2020 Design
2020.04.01

Since KFC represents hook-ups nowadays, Kentucky Fried Chicken will just book the hotel room for you!

If you ask a person randomly on the streets in Taiwan his or her impression

Columns On Market Trends
2020.04.01

The Impact of smartphone Holding Methods on UI Design, Let’s Talk about Thumb Rules

Thumb Zone Interaction Design - Mobile UX ▲Photo by Andrea Natali on Unsplash When Saha

Columns On UX
2020.04.16

GAMANIA 25th KEEP ROLLING

Gamania will officially enter its 25th year in 2020. In this issue of G!VOICE, we

Feature VOL. 89
2020.04.01

Gamania First Mild Builder Mobile Game “Komori Life” World Debut on Mar 25!

Pre-registration for dual platform and exclusive release of limited edition browser game "Komori Life Cat"

Events TW