© 株式会社エレファンキューブ

2015/03/10 支倉常明

プログラムとは？FLASH 01

© 株式会社エレファンキューブ

目次

1. プログラムとは？

2. プログラムを設計するとは？

3. ヌケ・モレ・矛盾がおきない設計をする

4. いきなりコードではなく、日本語で考える

5. 基本１：プログラムは順番に動く

6. 基本２：それがいつ動くかで考える

7. 基本３：ＵＩ設計と一心同体

8. 結論：スマートなロジックが組めるか

2

© 株式会社エレファンキューブ

1.プログラムとは 1

• 次から、FLASHで説明しますが、今回は、汎用的な内容です

• プログラム＝コンピューターへの命令

• コンピューター：頭の回転は速い。言われたことしかできない。

• プログラムするって？

• 最小単位まで細分化して考える

3

© 株式会社エレファンキューブ

1.プログラムとは 2

• 例１「朝起きて9：00までに出社する」• 起きる → ベッドから出る → 顔を洗う → 歯を磨く → 着替える → 朝食を食べる

→ 駅まで歩く → 電車に乗る → 乗り換える → 江戸川橋駅で降りる → 会社まで歩く → 出社

• これではコンピューターは動けない！

• 例２「ボタン押したら、文字が光る」• どのボタン？• どの文字？• 光るって？ 色を変える？ 点滅する？• もう１回おしたらどうなるの？• そもそも、光らせる意図は？ 指示なの？警告なの？インジケーターなの？

4

© 株式会社エレファンキューブ

1.プログラムとは 3

• トリガーがあって、何かしらの動作をする

5

トリガー○○したとき、

動作○○する！

© 株式会社エレファンキューブ

2.プログラムを設計するとは？

• 何をするプログラムなのか？を定義する ［音楽プレイヤー］

• どんなUI（ユーザーインターフェイス）ですか？

• どこをどう操作したらどうなりますか？

• ユーザーアクション以外のトリガーないですか？ 例：再生がおわったら

• 前提は？曲のデータはどこにあるの？

• 要するに、全体から細部へブレークダウンしていく。UIから入るでよい。6

© 株式会社エレファンキューブ

3.ヌケ・モレ・矛盾がおきない設計をする

• コンピューターは、いわれたことしかできない。• ヌケ・モレ（想定外）があると意図しない動作＝バグ• 例：一時停止中に次の曲ボタン 再生？停止？ボタンの見栄え？

• 矛盾がおきていないか？• これもバグ• 例：再生終わったのに「一時停止」ボタン表示のまま

• 人は、意味不明なことをする。• これも想定しなければならない

7

© 株式会社エレファンキューブ

4.いきなりコードではなく、日本語で考える

• 単発機能の実証は、いきなりコードでもOK

• 全体設計では、まず日本語で、自分が分かるように。

• 手書きでもPowerPointでもなんでも。

• 人に見せても伝わるように。

• 開発者向けには、UMLというものもある。（詳細わからん）http://www.itmedia.co.jp/im/articles/0206/12/news001.html

8

© 株式会社エレファンキューブ

5.基本1：プログラムは順番に動く

• 実際にはいろいろあるけど、基本として、順番に動く。

9

トリガーボタンおす

ボタンの色変える

ファイル読み込む

バッファされたら再生開始

ジャケット写真表示

再生時間を1秒ごと更

新・・・

© 株式会社エレファンキューブ

6.基本2：それがいつ動くかで考える

• トリガーと動作。

• トリガーは１つではない。動作も１つとは限らない。

• 例：ボタンおしたら再生する

• 例：再生中は、時間を1秒ごとに更新する

• 例：再生がおわったら次の曲を再生する

• 複数同時に発生しうる＝矛盾のないように。

• ハードウェア依存の動作も考えておく。スマホだとBack、Homeとか。バッテリー低下とか。

10

© 株式会社エレファンキューブ

7.基本3：UI設計と一心同体

• まずは、UIから考えるでOK。（大きい組織開発、業態は違うかも）

• 例外やエラーまでふくめてすべてのUIを想定する

• 例：ファイルがなかったらエラー画面だす

• というか、UIのほうが重要です。いかに分かりやすいか。ユーザーニーズにマッチしているか？

• 参考：UX（ユーザーエクスペリエンス）http://blog.excite.co.jp/spdesign/19566265/

11

© 株式会社エレファンキューブ

8.結論：スマートなロジックがくめるか

• 動かすのはできる

• いかにバグの起きないスマートなロジックがくめるか？ がポイント。

• 具体例は追々の勉強会で。

• プログラムの完成度をきめるのは、設計が７割、プログラムのコードが３割。

12