1. オリジナルデジタル時計アプリをつくる
事前課題

2. 今回のiPhoneアプリ開発研修では、大きく２つの事を学びます。
1.企画開発力
2.アプリの開発環境とアルゴリズム
1.企画開発力に関しては、「オリジナルデジタル時計」をつくります。
自分で考えた時計が、実際に実機で動く事を体験し、企画開発力によって、同じ時計デジタル時計でも、
受講生全員がオリジナルのものをつくることができることを体感致します。
オリジナルデジタル時計についてはコーディング済みのアプリの、
コンテンツ画像を変更する、という作業を致します。
当日の時間も限られておりますので、コンテンツに関しましては、事前にご準備頂きたく存じます。
事前課題内容は下記となります。
・オリジナルデジタル時計のコンセプトメイキング
・画像等の事前収集
お忙しい中恐縮には存じますが、ご確認頂ければ幸いにございます。

3. 1.時計のコンセプトを考える
自分の考える理想（好きな）の時計アプリケーションのコンセプトを考えます。
まずは、白紙の紙に自分のイメージの時計を描くことをお勧めします。
（例） ソフトバンク 自分の好きな選手時計
1:秋山監督
2:和田
3:松中
4:小久保
・
・
7:杉内
8:馬原
9:柴原
0:王監督
これを「１」とする！

4. 例えばこんな感じです。 数字を凝って、背景はシンプルに！
＜コンセプト＞ 好きなサッカーチーム
0.png 1.png 2.png 3.png 4.png
haikei
5.png 6.png 7.png 8.png 9.png

5. （例） オリジナル 人間時計
数字時計
●画像をwebから持ってきたり、 ●デジカメで撮影など。
例えばお子さんの写真データを持ってき
たりしても構いません。 ●画用紙にクレヨンで手書きで書いたり
などして、スキャナで画像を取りんだり
●イラストレーター等を使用し、 しても大丈夫です。
画像をオリジナルでつくったり、
修正しても構いません。

6. 2＊オリジナル数字をつくる
オリジナルで考えた数字を、各々一つの数字として保存しましょう。
例えば、1という数字であれば、「1.png」として保存しておいて下さい。
]
1.png
2.png
半角英数 png形式で保存してください！
…
0.png
コロン.png 全角カタカナ
デスクトップに保存
※コロンも用意しておきましょう。

7. 3＊画像をWebからダウンロードして数字をつくる場合の方法
数字1の場合は、「1.png」
と名前をつける！
保存 ！

8. 注意！Webからダウンロードして数字をつくった場合
pngという名前でつくっていても、jpeg形式で保存されている場合が多いので注意！
デスクトップの
保存した画像を
ダブルクリック
して開く
PNGを選択
書き出します 保存

9. 4＊背景の画像もつくりましょう。
背景画像
] 半角英数
名前は「haikei」
でデスクトップ保存

10. 5＊アイコンの画像もつくりましょう。
アイコンにする画像を準備して、デスクトップ上に保存しましょう。
右クリックで画像をペイントかプレビューで開くと、下記のような画像になります。
ツールバーの変形の中から、キャンパスの色とサイズ（もしくはサイズ変更）を選び、
画像の大きさを32ピクセル×32ピクセルに変更して名前をつけて保存しなおしましょう。
名前：「icon」
幅：「32 px」
高さ：「32 px」
※ピクセル形式なので注意してください
名前は「icon」
でデスクトップ保存

11. 6＊事前準備終了
事前準備おつかれさまでございました。
＜準備物確認＞
・オリジナル時計コンセプト
・0∼9までの数字画像、コロンの画像、背景画像、アイコンの画像
※名前も下記のままで御願いします。
0.png, 1.png, 2.png, 3.png, 4.png, 5.png, 6.png, 7.png, 8.png, 9.png, コロンpng, haikei.png,icon.png
事前準備に関しまして、わからないところなどありましたら、
できるところまでご準備頂ければ幸いです。
以上でオリジナル時計の事前準備は終了となります。
それでは、当日お会いできる事を楽しみにしております。

12. 参考＊イラストレーターの使い方(1)
Dockの中から、
イラストレーター
を選択
「ファイル」＞「新規」を選択
名前：「数字」
アードボードの数：「１１」 （横一列）
単位：「ピクセル」
→ 「OK」を押す
間隔：「10 px」
幅：「250 px」
高さ：「350 px」

13. 参考＊イラストレーターの使い方(2)
ひとつひとつの
アートボードに
1,2,3,4,5,6,7,8,9,0, :
の11データの
オリジナルデザイン
を行う。

14. 参考＊イラストレーターの使い方(3)
保存したいアートボードを選択後、
「ファイル」＞「WEBおよびデバイス用に保存」
を選択。
「PNG-24」で保存。