$30 off During Our Annual Pro Sale. View Details »

tsunagu XD - Director to Engineer

yampuu
July 06, 2019

tsunagu XD - Director to Engineer

「ディレクターとエンジニアを繋ぐXD」

ウェブ制作19年、2018年11月XDはじめました。水族館のウェブリニューアルのお話が舞い込み、初のXD納品案件となりました。デザイナーのアイデアをディレクターやクライアントやエンジニアに共有するのにとても便利なツールXD。社内XD検定はじめました。社内全員標準化へ。(ディレクターもエンジニアも使える状態に)

自己紹介

 柳谷 武
 
 ・シェアフル
 ・こぐるみ
 ・カンドウコーポレーション

 制作会社に19年
 DTP・ウェブやアプリやプロダクトのデザイナーと実装エンジニアをしています。

 
・事例
 ・アクアス (急遽な コンペ提案のお話が)

 ・改善案を企画
 ・デザイナーの思いついた提案
  ・タイムライン表示 期間から日ごとへ
  ・イベントと タイムラインの 連動
    ・イベント←遷移→タイムライン 
  ・今日の予定がわかるタイムライン
  ・イベントやパフォーマンスが

 ↓

 ※提案が目新しいほど実現できるのか心配される(デザイナーの中では仕様ができている)
 グラフ

 目新しい 説明が必要
 セオリー 説明が不要
 
 目新しい つくりがいがる
 セオリー コモディティー

 ↓

 そこで XD

 ・プロトタイプつくる

  ・ユーザー視点の共有(デザイナーとディレクター/クライアント)
  ・仕様の共有(デザイナーとエンジニア)

  ・現在時間の実装
  ・期間ごとのデータを日付ごとのデータにみせる

 ・より深くつくれる

  ・エンジニア  仕様が詰めやすくなった 工数短縮
  ・ディレクター ペルソナになりきれた  確認深度
  ・クライアント 仕上がりがイメージできた
  ・デザイナー  連携がしやすくなった

 XDの可能性

  ・コンポーネントでデザインパーツを用意
   プランナーをデザイナー化
    ワイヤーがデザインの下地ファイルに
    コーディングするときと同じ画像を使う
  
  ・コンポーネントと共通のHTMLを用意
   コーディングの自社フレームワーク化

XD社内検定

 Lv1----------確認可

 プロトタイプの必要性認知
 スマホXDで実機確認の操作ができる
 URL共有リンクが作れるができる
 URL上でコメントとタスク完了を操作できる
 確認操作全般をクライアントに説明

 Lv2----------編集可

 文字と画像の編集ができる
 アートボードが作れる
 遷移を作れる

 Lv3----------制作可

 パーツのコピペ
 リピートグリッドの編集
 コンポーネントの編集
 パーツの固定 全面背面の変更

 Lv4----------応用レベル

 レスポンシブできるコンポーネント作成
 UI設計
 UX設計
 スプレットシート連携
 プラグイン活用もろもろ

クライアント、ディレクターとエンジニアを繋ぐXD

yampuu

July 06, 2019
Tweet

More Decks by yampuu

Other Decks in Design

Transcript

  1. View Slide

  2. View Slide

  3. View Slide

  4. View Slide

  5. View Slide

  6. View Slide

  7. View Slide

  8. View Slide

  9. View Slide

  10. View Slide

  11. View Slide

  12. View Slide

  13. View Slide

  14. View Slide

  15. View Slide

  16. View Slide

  17. View Slide

  18. View Slide

  19. View Slide

  20. View Slide

  21. View Slide

  22. View Slide

  23. View Slide

  24. View Slide

  25. View Slide

  26. View Slide

  27. View Slide

  28. View Slide

  29. View Slide

  30. View Slide

  31. View Slide

  32. View Slide

  33. View Slide

  34. View Slide

  35. View Slide

  36. View Slide