2013.10.12初音玲

チーム開発の要はViewModelにある

自己紹介▷お仕事の略歴

•システム企画

•インフラ構築

•業務アプリ構築

• DB設計、構築、各種支援

▷お仕事外の略歴

• Microsoft MVP for Developer Tools (2008/04-14/03)

• Oracle ACE (2008/04-:日本で２人目)

はじめてシリーズ

▷はじめてのVC#2012

Kinect本 監修▷音声認識(Speech SDK)の解説あります

画面デザインの分業

分業は失敗する

なぜ、デザイン分業は失敗するのか？デザイナがパワーポイントやIllustratorで静止画としてデザイン

デザインパーツと称して、個々の枠をデザインから抜き出し

デザインパーツができてからあとから可変部分をコードで表示

デザインセンスのない可変部分の表示

後工程でデザイナがいないので

可変部分だけで詳細調整

ペイントブラシで画像修正

これじゃない画面が完成

なぜ失敗しつづけるのか

理由は明白です

可変データ込みの

デザイン決定者の不在

分業したはずなのに

最後のデザイン調整は

「デザインできませんから」

といった開発担当

これでうまくいったら奇跡

Or

担当者ががんばった

運任せ

Or

属人性

そこで

ViewModel先行

WindowsストアアプリのViewModelとは

プロパティ

メソッド

XAMLBinding

データ (プロパティ)

業務logic (メソッド)

View ViewModel Model

プロパティ参照Binding

プロパティ更新

メソッド実行

メソッド実行

WindowsストアアプリのViewModelとは

プロパティ

メソッド

ViewModel

ViewModelのプロパティとメソッド▷UI工程の最初に設計

プロパティ

メソッド

設計工程での画面デザイン▷ソリューションに以下のクラスファイルを追加

• Modelのクラス

• ViewModelのクラス

• Viewのクラス

設計工程での画面デザイン

▷ViewModelに設計済のプロパティとメソッドを定義

•入口の定義だけで中身はなくてよい

設計工程での画面デザイン

▷ViewModelのクラスを継承してサンプルデータクラスを作成

• Blendの機能でクラスからサンプル生成可能

設計工程での画面デザイン

▷デザイナがViewをXAMLを使ってデザイン•サンプルデータを使って可変部分も含めてデザイン

• StoryBoardを使ってアニメーションもデザイン

•開発担当は、必要に応じてコンバーターを提供

•自然とコラボレーション

XAMLで

デザイン担当と

開発担当は

語り合う

できるWeb会社は

HTMLと

JavaScriptで

語り合う

まとめ▷デザイン担当に必要情報を渡すために

• ViewModelクラスとサンプルデータクラスの提供

▷開発担当がデザインコンセプトを理解するため

• XAMLを使ってデザインし会話

つまり

ロジックがなくても

デザインが確認できる

設計工程 成果物

ロジックに専念できる

設計工程 成果物

スタートは

開発担当が作る

ViewModel

FIN