More Related Content Similar to Room metro Tokyo #3 発表資料です。 (20) Room metro Tokyo #3 発表資料です。6. Self Introduction
亀 谷 学人 (かめや まなと)
• Work
− 拝承業者? (メーカー系 SIer 所属エンジニア)
− C# + WPF (Windows Client Application 開発)
• Private activity
− Twitter: @Grabacr07 (ぐらばく)
− http://grabacr.net/
− めとべや東京勉強会 スタッフ
なんかずっと目が死んでる
7. Self Introduction
• 2013/07/27 着任、舞鶴鎮守府
• イベント
8 月: E2 で終了…
11 月: E5, E6, E7 踏破
• 近況
艦隊司令部 Lv. 102
図鑑回収 153/155 (98 %)
残り: 大和改・Верный
• 大型艦建造 大鳳: 7 回目で入手 (3500/3500/6000/6000/20)
大和: 19 回目で入手 (4000/5000/6000/2000/1)
資源やばい
ケッコン準備できました
15. Feature of KanColle
• プレイヤーって何してるの?
− 艦隊の編成
− 資源を消費して新しい艦を建造
無茶な大型艦建造… ダメ、ゼッタイ。
− 資源を消費して新しい装備を開発
− 資源を消費して出撃
− 資源を得るために遠征
etc…
16. Feature of KanColle
• プレイヤーって何してるの?
− 艦隊の編成
− 資源を消費して新しい艦を建造
無茶な大型艦建造… ダメ、ゼッタイ。
− 資源を消費して新しい装備を開発
− 資源を消費して出撃
− 資源を得るために遠征
etc…
•
•
•
•
燃料
鋼材
資源がすべて!
弾薬
ボーキサイト
艦これの本質は「兵站 (Military Logistics)」にある と思います
18. Motivation of development
• 適切な兵站管理をしたい! (攻略のために)
「物資の配給、整備、兵員の展開や衛生、施設の構築や維持などが含まれる」
by Wikipedia
• プレイ中の脳内
兵站管理
艦娘かわいい!!!
計画
情報整理
時間管理
19. Motivation of development
• 適切な兵站管理をしたい! (攻略のために)
「物資の配給、整備、兵員の展開や衛生、施設の構築や維持などが含まれる」
by Wikipedia
資源 -> 戦力への変換
いかにして効率上げるか
(ここを楽しんでる)
• プレイ中の脳内
ここを何とか
楽にしたい…
兵站管理
艦娘かわいい!!!
計画
情報整理
時間管理
21. Motivation of development
• UI デザインが割とアレ
− 必要な情報にアクセスしにくい
▫ バケツの残数見られない
▫ 所属艦娘が一覧できない
▫ etc…
− 画面遷移が重たい
▫ 母港 (ホーム画面) に戻る度に
すべての艦娘データを DL …
23. Motivation of development
• 提督業には時間がかかる
「マップ攻略時に戦艦・正規空母を運用しない」
縛りプレイのK氏、11 月イベントの E4 について
「65 時間かけたけど
クリアできませんでした!」
−
(上記はかなり極端な例としても)
社畜にはつらい拘束時間
− 他作業と並行できるプレイスタイルが求められる
32. FiddlerCore
• ネットワークキャプチャ
− AfterSessionComplete イベントを Rx で
− Path によってパース処理を振り分け
LINQ ですから!
.Where(predicate) で振り分け
Rx の得意技
▫ /kcsapi/api_get_member/deck
… 艦隊編成情報
▫ /kcsapi/api_get_member/ship
… 所属するすべての艦娘の情報
▫ /kcsapi/api_get_member/slotitem … 保有するすべての装備の情報
▫ /kcsapi/api_get_master/ship
… すべての艦娘の定義情報
Twitter クライアントの UserStreams 対応とかに応用してください
33. JSON -> C#
• JSON 対応クラス生成
JSON text (“svdata=“ を除いた部分) を
クリップボードにコピーして…
svdata={"api_result":1,"api_result_msg":"¥u62
10¥u529f","api_data":[{"api_member_id":363789
,"api_id":1,"api_name":"¥u5f13¥u9053¥u90e8","
api_name_id":"112759902","api_mission":[0,0,0
,0],"api_flagship":"0","api_ship":[681,184,55
4,364,1490,1269]},{"api_member_id":363789,"ap
i_id":2,"api_name":"¥u7b2c¥u4e00¥u6c34¥u96f7¥
u6226¥u968a","api_name_id":"111744015","api_m
ission":[1,9,1382989946530,0],"api_flagship":
"0","api_ship":[13,20,12,387,54,43]},{"api_me
mber_id":363789,"api_id":3,"api_name":"¥u7b2c
¥u4e8c¥u6c34¥u96f7¥u6226¥u968a","api_name_id"
:"111744021","api_mission":[1,13,138298996424
6,0],"api_flagship":"0","api_ship":[26,18,403
,530,1096,1704]},{"api_member_id":363789,"api
_id":4,"api_name":"¥u7a7a¥u6bcd¥u6a5f¥u52d5¥u
90e8¥u968a","api_name_id":"111323146","api_mi
ssion":[1,15,1383020303668,0],"api_flagship":
"0","api_ship":[332,174,539,225,1705,1022]}]}
34. JSON -> C#
• JSON 対応クラス生成
JSON text (“svdata=“ を除いた部分) を
クリップボードにコピーして…
svdata={"api_result":1,"api_result_msg":"¥u62
10¥u529f","api_data":[{"api_member_id":363789
,"api_id":1,"api_name":"¥u5f13¥u9053¥u90e8","
api_name_id":"112759902","api_mission":[0,0,0
,0],"api_flagship":"0","api_ship":[681,184,55
4,364,1490,1269]},{"api_member_id":363789,"ap
i_id":2,"api_name":"¥u7b2c¥u4e00¥u6c34¥u96f7¥
u6226¥u968a","api_name_id":"111744015","api_m
ission":[1,9,1382989946530,0],"api_flagship":
"0","api_ship":[13,20,12,387,54,43]},{"api_me
mber_id":363789,"api_id":3,"api_name":"¥u7b2c
¥u4e8c¥u6c34¥u96f7¥u6226¥u968a","api_name_id"
:"111744021","api_mission":[1,13,138298996424
6,0],"api_flagship":"0","api_ship":[26,18,403
,530,1096,1704]},{"api_member_id":363789,"api
_id":4,"api_name":"¥u7a7a¥u6bcd¥u6a5f¥u52d5¥u
90e8¥u968a","api_name_id":"111323146","api_mi
ssion":[1,15,1383020303668,0],"api_flagship":
"0","api_ship":[332,174,539,225,1705,1022]}]}
自動生成!
35. JSON -> C#
• JSON 対応クラス生成
− Visual Studio 2013 で自動生成しよう
編集 > 形式を選択して貼り付け > JSON をクラスとして貼り付ける
Grabacr07.KanColleWrapper¥Modes¥Raw¥*
• あとは煮るなり焼くなり
− DataContractJsonSerializer
− Json.NET
− DynamicJson
Grabacr07.KanColleWrapper¥Models¥SvData.cs
―――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――
var bytes = Encoding.UTF8.GetBytes(json);
var serializer = new DataContractJsonSerializer(typeof(svdata));
using (var stream = new MemoryStream(bytes))
{
var result = serializer.ReadObject(stream) as svdata;
}
36. JSON -> C#
• JSON 対応クラス生成
− Visual Studio 2013 で自動生成しよう
編集 > 形式を選択して貼り付け > JSON をクラスとして貼り付ける
Grabacr07.KanColleWrapper¥Modes¥Raw¥*
• あとは煮るなり焼くなり
− DataContractJsonSerializer
− Json.NET
− DynamicJson
めっちゃ楽。こっちにしときゃよかった?
―――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――
var result = JsonConvert.DeserializeObject<svdata>(json);
37. JSON -> C#
• JSON 対応クラス生成
− Visual Studio 2013 で自動生成しよう
編集 > 形式を選択して貼り付け > JSON をクラスとして貼り付ける
Grabacr07.KanColleWrapper¥Modes¥Raw¥*
• あとは煮るなり焼くなり
− DataContractJsonSerializer
− Json.NET
− DynamicJson
Grabacr07.KanColleWrapper¥Quests.cs
(JSON 対応クラスでもどうにもならないケースがあった場合など)
―――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――
var djson = DynamicJson.Parse(json);
var questlist = new kcsapi_questlist
{
api_count = Convert.ToInt32(djson.api_data.api_count),
api_disp_page = Convert.ToInt32(djson.api_data.api_disp_page),
api_page_count = Convert.ToInt32(djson.api_data.api_page_count),
api_exec_count = Convert.ToInt32(djson.api_data.api_exec_count),
};
38. Dockyard
• Q. なんで建造する艦のネタバレできるの?
A. サーバーから送られてきてる
/kcsapi/api_get_member/kdock
public class kcsapi_kdock
{
public int api_member_id { get; set; }
public int api_id { get; set; }
public int api_state { get; set; }
// ドックの状態 (ロック、未使用、建造中、完成)
public int api_created_ship_id { get; set; }
// 完成する艦娘の ID
public long api_complete_time { get; set; }
// 完成する時刻 (Unix 時間)
public string api_complete_time_str { get; set; }
public int api_item1 { get; set; }
// 投入した燃料
public int api_item2 { get; set; }
// 投入した弾薬
投入資源と完成する艦が
public int api_item3 { get; set; }
// 投入した鋼材
同時に把握できるので、
public int api_item4 { get; set; }
// 投入したボーキサイト
人力でない正確なデータの
public int api_item5 { get; set; }
// 投入した開発資材
収集などに向いてるかも
}
41. Visual Studio like window
• Visual Studio 2012/2013 の濃色テーマ のようなもの
ItemsControl
KanColleViewer では
コントロールの外観を
すべて自作
TabControl
Grabacr07.KanColleViewer¥Themes¥Mukyutter.Dark.xaml
Button, CheckBox, ScrollBar, …
アプリ内で使用するすべてのコントロールの外観を Style で定義
43. Style & Templates
• コントロールのスタイルとテンプレート (MSDN)
http://msdn.microsoft.com/ja-jp/library/aa970773(v=vs.110).aspx
− 標準コントロールの
テンプレート実装例集
▫ 各コントロールの構成要素の学習
▫ XAML 力の向上 (私はこれで鍛えた)
− サンプル アプリも
▫ 残念ながらダサい 今風ではない
▫ あくまで学習用ということで
45. Modern Desktop apps
• 既成のテーマによるモダンなデスクトップ アプリの実装
車輪の再発明を避けたい or 手間をかけたくないのなら
− Elysium
▫
http://elysium.codeplex.com/
▫
以前から Zune を意識してた感じ?
46. Modern Desktop apps
• 既成のテーマによるモダンなデスクトップ アプリの実装
車輪の再発明を避けたい or 手間をかけたくないのなら
− Elysium
▫
http://elysium.codeplex.com/
▫
以前から Zune を意識してた感じ?
− MahApps.Metro
▫
http://mahapps.com/MahApps.Metro/
▫
アニメーション等の質は Elysium より良い
▫
ウィンドウの枠が光る効果は私のコードが使われてる
「WPF で Visual Studio 2012 のような光るウィンドウを作る」
http://grabacr.net/archives/507 _
49. Equipment Icons
• 装備を一目で確認したい
− ダメコン搭載忘れ防止
− 彩雲搭載忘れ防止
など
アイコン見れば
だいたいわかる
Grabacr07.KanColleViewer¥Themes¥Generic.xaml
− 全部 Blend for Visual Studio で Path 描いた
− Path の描き方の詳細は私のブログ記事にて
「XAML でクラウディアさんを描いてみました」
http://grabacr.net/archives/795 _
57. Feedback
• ダウンロード数
− 公開 ~ 3 日間: 10,000 downloads
− 1/18 現在:
38,484 downloads
• grabacr.net 閲覧数
− 公開 ~ 5 日間: 40,000 PV
ちょいちょいサーバー落ちてた… 大変申し訳なく
− 以降:
2,000 PV/day
58. Conclusion
• 常にエゴサーチしてます
− ユーザーの生の声 生々しい感想
− 要望多し
▫ Windows 7 対応 (トースト通知の代替手段) -> 完了! (時期リリースで搭載)
▫ 低解像度 / 高解像度対応…
High DPI / Per-Monitor DPI 対応が急務 (Interne Explorer の対応が面倒…)
• 流行に乗るとつよい (つよい)
• 提督業も忙しい! ので、快適なプレイ環境で艦娘を可愛がりましょう!