ゆめみ流 クライアントワークにおけるトライアル&エラー

25
ゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆ ゆゆゆ 2016.11.29 ゆゆゆゆゆゆゆ ゆゆ ゆゆ

Upload: shusuke-toda

Post on 18-Jan-2017

366 views

Category:

Design


0 download

TRANSCRIPT

Page 1: ゆめみ流 クライアントワークにおけるトライアル&エラー

ゆめみ流クライアントワークにおけるトライアル&エラー

2016.11.29 株式会社ゆめみ 戸田 修輔

Page 2: ゆめみ流 クライアントワークにおけるトライアル&エラー

ゆめみ流クライアントワークにおけるトライアル&エラー目次

・自己紹介

・ゆめみの Prott サマリデータ

・ゆめみ(=クライアントワーク)の案件の特徴

・ゆめみ(=クライアントワーク)での Prott+Sketch の現実

・トライアル&エラー①

・トライアル&エラー②

・トライアル&エラー③

・おまけ:グルーピングとアカーイブルール

Page 3: ゆめみ流 クライアントワークにおけるトライアル&エラー

ゆめみ流クライアントワークにおけるトライアル&エラーゆめみの紹介 と じぶんの紹介

戸田修輔 (クリエイティブ・)ディレクター

2003 年 ゆめみ入社。

1990 年代から独学でのモバイルコンテンツ制作を経て、数々のモバイルサイトデザイン・コーディングを担当。

以降、デザイン〜フロントエンド全般を担当しながら、日本マクドナルドのポータルサイト企画・運用統括などの経験を経て、現在は多数の案件の(クリエイティブ・)ディレクションを行う。

また、モバイルデザインについては、著書の執筆も行った実績を持つ。

株式会社ゆめみ

2000 年設立、東京と京都が拠点。

【事業内容】・モバイルサービスを主とした受託開発・制作・コンサルティング・オムニチャネルを中心としたデジタルマーケティング支援・サービス運用代行/自社サービス運営

Page 4: ゆめみ流 クライアントワークにおけるトライアル&エラー

ゆめみ流クライアントワークにおけるトライアル&エラーゆめみの Prott サマリーデータ

利用期間 1年 ( 2015 年 11 月〜 Enterprise プランを利用)

利用人数役割としてはディレクター、プランナー、デザイナーのメンバーが中心

常に利用しているのは8名くらい (全体の半分弱)

プロジェクト数 13Project  (アプリ:6/スマホサイト:3/ PC サイト:3/その他:1)

スクリーン数 最大 270 スクリーン/平均 66 スクリーン

Page 5: ゆめみ流 クライアントワークにおけるトライアル&エラー

ゆめみ流クライアントワークにおけるトライアル&エラー

ゆめみの案件の特徴

Page 6: ゆめみ流 クライアントワークにおけるトライアル&エラー

ゆめみ流クライアントワークにおけるトライアル&エラーゆめみの案件の特徴

ヒアリング 提案 受注・キックオフ 設計 デザイン 製造・開発

1Week 4Week

設計〜デザインが短いことが多い

高速化を目的にPrott+Sketch

を導入

受注・キックオフ 設計 デザイン

Page 7: ゆめみ流 クライアントワークにおけるトライアル&エラー

ゆめみ流クライアントワークにおけるトライアル&エラーゆめみの案件の特徴

ヒアリング 提案 受注・キックオフ 設計 デザイン 製造・開発

1Week 4Week

設計〜デザインが短いことが多い

高速化を目的にPrott+Sketch

を導入

受注・キックオフ 設計 デザイン

提案時にこのような資料も用意しています。

Page 8: ゆめみ流 クライアントワークにおけるトライアル&エラー

ゆめみ流クライアントワークにおけるトライアル&エラー

ゆめみでの Prott+Sketch の現実

Page 9: ゆめみ流 クライアントワークにおけるトライアル&エラー

ゆめみ流クライアントワークにおけるトライアル&エラーゆめみでの Prott+Sketch の現実

ヒアリング 提案 受注・キックオフ 設計 デザイン 製造・開発

+スケッチ ワイヤーフレーム デザイン(モック) プロトタイプ理想

ワイヤーフレーム モックアップ プロトタイプ現実

ラフ案

デザイン案

高速プロトタイピングツールとしての活用ではなく、

デザイン制作〜 FIX までの効率化や、時間短縮目的用途になってしまうことが多い。

(結果として…)

Page 10: ゆめみ流 クライアントワークにおけるトライアル&エラー

ゆめみ流クライアントワークにおけるトライアル&エラーゆめみでの Prott+Sketch の現実

ワイヤーに特化すべきなのはわかっているけれど、

デザインの紙芝居として使ってしまう。

高速プロトタイピングツールとしての活用ではなく、

デザイン制作〜 FIX までの効率化や、時間短縮目的用途になってしまうことが多い。

(結果として…)

ここにクライアントワークにおける

トライアル&エラーが存在する

Page 11: ゆめみ流 クライアントワークにおけるトライアル&エラー

ゆめみ流クライアントワークにおけるトライアル&エラーゆめみでの Prott+Sketch の現実

導入して良かったことは、もちろんあります。

【良かったこと】

設計、デザインフェーズでの工数(見積)

20% 以上減

パワポドキュメント化不要

による時間短縮

見える化/動く化で、イメージが共有でき、

デザイン案制作範囲を絞りこめることによる

作業量軽減

Page 12: ゆめみ流 クライアントワークにおけるトライアル&エラー

ゆめみ流クライアントワークにおけるトライアル&エラー

トライアル&エラー①「使ってくれない」

Page 13: ゆめみ流 クライアントワークにおけるトライアル&エラー

ゆめみ流クライアントワークにおけるトライアル&エラー① 使ってくれない

提案時に「 Photoshop や Illustrator は使いませんよ。 Prott 使いますからね!」と伝え、

その場ではクライアントも、スピード感もありそうだと、反応が良いのですが…

クライアントが積極的に使ってくれても…

・アプリではなくスマホブラウザで閲覧してしまっていて動きがやや重たい

・コメント欄が一方通行になってしまう

・ Prott に書いたのか Slack に書いたのかわからなくなってしまう

五月雨で制作して連絡してもみてくれない(使ってくれない)

▼定例ミーティングの場ではじめて触るので、イチから使い方を教える

▼いろいろ時間をロスして、やっぱり紙(パワポ)で欲しいと言われる

今後の改善に期待

Page 14: ゆめみ流 クライアントワークにおけるトライアル&エラー

ゆめみ流クライアントワークにおけるトライアル&エラー① 使ってくれない

プロジェクト内で利用していればコミュニケーションや時間の効率化に繋がるので、

無理して最初からクライアントに使ってもらう必要はありません。

普段通りにワイヤーフレームやデザイン案をドキュメントで用意し、挙動の説明が難しい箇所などで、

「ちょっと動くものを用意してみたのですが。」的にチラ見せする程度でも充分効果的に使えます。

また、この時点でクライアント自身が社内説明をしやすいイメージを持ってもらえると、

一緒に積極的に利用してもらえる可能性が高まります。

チラ見せして、使わせない。

Know-how

Page 15: ゆめみ流 クライアントワークにおけるトライアル&エラー

ゆめみ流クライアントワークにおけるトライアル&エラー① 使ってくれない

【参考】バッドケース( Prott を無理やり使ってもらおうとして失敗した遷移資料)

Page 16: ゆめみ流 クライアントワークにおけるトライアル&エラー

ゆめみ流クライアントワークにおけるトライアル&エラー

トライアル&エラー②「要求が増えていく」

Page 17: ゆめみ流 クライアントワークにおけるトライアル&エラー

ゆめみ流クライアントワークにおけるトライアル&エラー② 要求が増えていく

「ワイヤーに特化すべきなのはわかっているけれど、デザインの紙芝居として使ってしまう。」

ことが原因で、

という要望が増えていきます。

「今の段階では出来ません!」と言うのは簡単ですが、なんとか解決策を探したいところです。

・もっと動いたのをみてみたい!

・(既成アプリを持ち出されて)こういう風には動かない?

Page 18: ゆめみ流 クライアントワークにおけるトライアル&エラー

ゆめみ流クライアントワークにおけるトライアル&エラー② 要求が増えていく

Flash でアニメーションや操作性を実現させているケースをよく見掛けます。

これはこれで、ひとつの解決策ですが、以下のような注意点があると考えています。

・動きは理想的に実現しても、そのままスマホ(アプリ)に流用できないことが多く、作り直す必要がある。

 →組み直した結果、動作が変わってしまうリスク

・ CPU に負荷がかかる。

 →動作が重くなる(端末の発熱もある)。クライアントはデモとして不安を感じてしまう。

Flash (現 Animate )でデモ制作する。

Technic

Page 19: ゆめみ流 クライアントワークにおけるトライアル&エラー

ゆめみ流クライアントワークにおけるトライアル&エラー② 要求が増えていく

現実に、クライアント側が、 UI/UX やインタラクティブな部分に興味を持ち、こだわりはじめるのは、

Prott ( Web プロトタイピング)でイメージの磨り合わせが FIX した後に発生するケースが多いと実感してい

ます。

受託側には、予算、納期、リソースに限りがあり、開発段階に入ってしまってからの大幅な手直しやデザイン修

正が発生すると、無駄なコストや労力を強いられることになるため、これを解決するために自前でもプロトタ

イプ開発ツールを用意することで、様々なクライアンとの要求に対応しています。

プロトタイプ開発エンジンをつくった。

Know-how

Page 20: ゆめみ流 クライアントワークにおけるトライアル&エラー

ゆめみ流クライアントワークにおけるトライアル&エラー② 要求が増えていく

現実に、クライアント側が、 UI/UX やインタラクティブな部分に興味を持ち、こだわりはじめるのは、

Prott ( Web プロトタイピング)でイメージの磨り合わせが FIX した後に発生するケースが多いと実感してい

ます。

受託側には、予算、納期、リソースに限りがあり、開発段階に入ってしまってからの大幅な手直しやデザイン修

正が発生すると、無駄なコストや労力を強いられることになるため、これを解決するために自前でもプロトタ

イプ開発ツールを用意することで、様々なクライアンとの要求に対応しています。

プロトタイプ開発エンジンをつくった。

Know-how

Page 21: ゆめみ流 クライアントワークにおけるトライアル&エラー

ゆめみ流クライアントワークにおけるトライアル&エラー

トライアル&エラー③「 psd データを欲しがる」

Page 22: ゆめみ流 クライアントワークにおけるトライアル&エラー

ゆめみ流クライアントワークにおけるトライアル&エラー③psd データを欲しがる

いくら提案時に Adobe を使わないことを了承いただいたとしても、これは、ほぼ発生するケースです。

しかし、 psd が要らないから見積もりを抑えているのも事実だったりします。

・(既存ベンダーや他部署からの要望で)

 「やっぱり psd ( Photoshop データ)をいただきたいのですが…」

【見積もり時】

・前提条件に、 psd データでの納品はしない旨を明記する。(提案時にも説明する)

・オプション項目として psd データ納品の項目を用意する。

【データ請求時】

・ ai形式しかすぐに用意できない、無償で良いから、 ai データでも問題ないか交渉する。

・ Sketch から ai データにエクスポートし、微調整(数ピクセルずれたりする)し、納品する。

Know-how

Page 23: ゆめみ流 クライアントワークにおけるトライアル&エラー

ゆめみ流クライアントワークにおけるトライアル&エラー

おまけ「 Prott でのバージョン管理」

Page 24: ゆめみ流 クライアントワークにおけるトライアル&エラー

ゆめみ流クライアントワークにおけるトライアル&エラーおまけ

グルーピングとアーカイブのルール。

【グルーピング】

・機能毎にグループ化する

・機能毎に各々トップから遷移できるようにする

【アーカイブ】

・基本的に使わない

・ゴミ箱グループを用意し、そこに移動しておく

・毎回、会議の時点で複製する

※複製は過去 2 バージョンくらいを残しておき、

実際のバージョン管理は Sketch ファイルで管理。

Page 25: ゆめみ流 クライアントワークにおけるトライアル&エラー

ゆめみ流クライアントワークにおけるトライアル&エラー

お わ り