1

ファッション

コーディネートのための

Androidアプリの開発

阪南大学 経営情報学部 経営情報学科

5108064 小倉 彩佳

5108264 水谷 仁美

2

目次

第1章 はじめに…………………………………………………………………………………..3

第2章 関連研究…………………………………………………………………………………..5

第1節 スマートフォンについて…………………………………………………………...5

第2節 Android……………………………………………………………………………....5

第3章 システムの全体像………………………………………………………………………..7

第1節 システムの提案………………………………………………………………………7

第2節 詳細設計………………………………………………………………………………8

第4章 検証………………………………………………………………………………………..11

第1節 アプリケーションの動作確認……………………………………………………...11

第2節 問題点………………………………………………………………………………...12

第3節 今後の展望…………………………………………………………………………...15

第5章 まとめ……………………………………………………………………………………..16

参考文献……………………………………………………………………………………………17

謝辞…………………………………………………………………………………………………17

3

第 1章 はじめに

近年、iPhoneや Xperiaなどのスマートフォンが急激に普及している（図 1）。スマート

フォンには機能を追加することができるアプリケーションというものがある。アプリケー

ションはさまざまな種類があり、今後の拡張性に期待ができる。その普及の波に乗り、自

分の服のファッションを簡単かつ手軽にコーディネートするために、小型端末であるスマ

ートフォンを使い Android アプリケーションでファッションコーディネートできるシステ

ムを開発した。

本システムは次に示すような体験から開発を思いついた。朝、出かける準備をする時、

ファッションのコーディネートをするために服を脱ぎ着する。そのため、その日の服装を

決めるのにとても時間を使ってしまうことがある。女性の場合はヘアーセットやメイクを

するので、出かけるまでにとても時間がかかってしまい、朝食を抜いたり、電車に乗り遅

れたり、仕事や授業に遅刻しそうになることがある。準備をする時間を短縮したいが、ヘ

アーセットやメイクを短縮することは難しい。服をコーディネートする場合、なかなかコ

ーディネートが決まらない時はとても時間を使ってしまうことがある。そこで、コーディ

ネートの時間を短縮できないかと考えた。そこで考えたのが、Androidアプリを使ったコー

ディネートである。

96

136

194.5

284

396

474

571

0

100

200

300

400

500

600

2007年 2008年 2009年 2010年 2011年（予測） 2012年（予測） 2013年（予測）

スマートフォンの出荷台数と予測

国内スマートフォン出荷台数

前年比

図 1 スマートフォンの出荷台数と予測

引用：スマートフォン・入門から業界動向までひと目でわかる[1]

監修 夏野 剛

アスキー・メディアワークス出版

4

次に開発したシステムの概要を説明する。システムの概要を図 2に示す。本システムの

特徴はAndroid OS搭載の小型端末機に装備できるアプリケーションである。そのために、

Androidのアプリケーションを開発する際に必要なツールを組み込んだ統合開発環境の

eclipseを使い、プログラムを作成して実行しコンピュータ上のエミュレータで動作確認を

行う。確認後ノートパソコンと Android端末機を接続して、作成したアプリケーションを

端末機にインストールしていることが前提である。

アプリケーションの概要はコーディネートしたい服をカメラで撮影し、その服の画像を

ノートパソコンで処理してからプログラムに組み込む。そして、Android 用アプリケーショ

ンの中にプログラムから画像ファイルをアクセスすることが可能となり，実際の操作にお

いてコーディネートできる。これにより、朝の時間がないときでも短時間で服をコーディ

ネートすることが可能となる。さらに、自分の持っている服の数を把握や、服を購入する

際に、Android 上で自宅の服とのコーディネートを簡単に確認しながら検討することができ

るシステムである。

図 2 Android ファッションコーディネートアプリシステム概要

5

第2章 関連研究

本章では、本論文の技術的な説明を行う。1 節ではスマートフォンについて説明をする。

2節では、Androidについて説明をする。

第１節 スマートフォンについて

スマートフォンとは、携帯電話、PHSにパソコン、PDA で利用する高度なネットワーク

接続機能を搭載した機器のことである[2]。「Smart」（賢い、利口な）、「Phone」（電話）の

意味のとおり「多機能な電話」を意味する。現在日本で利用されている携帯電話は通話だ

けでなく iモードなどを使って電子メールを送受信や、Webページを閲覧することもでき

る。また、カメラ撮影、ワンセグでの TV視聴、音楽再生、おサイフケータイなど多くの機

能を備えているので、十分「多機能な電話」とも言えるが、「スマートフォン」とは言わな

い。従来の高機能な携帯電話と、今注目されているスマートフォンの違いについて説明す

る。

両者の違いは実は曖昧である。日本と欧米でのスマートフォンの定義もやや異なってい

る。従来からある高機能な携帯電話は、電話の音声通話を基本にデザインされていて、デ

ータ通信やカメラなどの機能を搭載して進化してきたのである。一方、スマートフォンは

インターネット端末としてデザインされていて、その機能の 1つとして音声通話機能を備

えている。また、PDAや Pocket PCのように実用的な機能も充実している。スケージュー

ル管理、アドレス帳などの個人情報管理、文書作成、計算機能などの機能はあらかじめ搭

載されている。また、オープンな開発環境が提供されていて、第三者が開発したアプリケ

ーションをユーザーがインストールして利用することで機能を追加していけることも大き

な特徴の 1つである。例えば、パソコンにアプリケーションソフトウェアをインストール

して自分の使いたい機能を追加できるのと同じである。

スマートフォンは、パソコンと携帯電話の中間に位置する、データ通信主体のコミュニ

ケーションに適したコンパクト機器である。

第２節 Android

Androidとは、主に携帯端末を対象としたオペレーティングシステムと、その汎用プラッ

トフォームである[3]。オペレーティングシステムだけでなく、ミドルウェア、主要アプリ

ケーション SDKなどを含めたソフトウェアの集合体を Android と呼ぶ。Androidの開発を

推進するために、Google社を中心とした 33社の企業が組織された団体、Open Handset

Alliance[4]あり、Open Handset Allianceがオープンソースとして提供している。

Androidの主な特徴の 1つとして、まずオープンソースであることが挙げられる。各フ

レームワークやライブラリ、カーネルやランタイムまでのすべてが無償で公開されている。

改変も自由に行うことができるため、開発する側にとっては大きな利点でもある。しかし、

6

様々なメーカーから多くの種類の携帯端末がリリースされ、それらに対応できるアプリケ

ーションを開発するには、考慮しなければいけない点が多くなってきている。そのため開

発者は、ターゲットとなる携帯端末を想定してアプリケーションを開発する必要がある。

Androidアプリケーションの開発には Android SDK(Software Development Kit）が提

供されている。通常の Androidアプリケーションの開発では、Android NDK(Native

Development Kit)を利用する。また、アプリケーションの高速化を行う場合などには

Android NDKと C言語を使用するが、主に Javaでの開発が一般的であり、Eclipseの利

用が公式に推薦されている。Eclipseは、IBM社が開発した、高機能な統合開発環境である。

Androidアプリケーション開発用のプラグインを Eclipseに組み込むことで、Androidアプ

リケーションの開発環境を整えることができる（図 3）。

Androidは、Android Market[5]というアプリケーション市場がある(図 4参照)。Android

Marketは作成したアプリケーションを自由に販売、配布することができる。この仕組みに

より、世界中の開発者が開発したアプリケーションを入手することができる。また、開発

者は気軽にアプリケーションを世界中に配信、販売することができるので非常に魅力的な

仕組みである。

図 3 左：開発画面 右：エミュレータ実行画面

図 4 Android Market

7

第 3章 システムの全体像

第 1 節 システムの概要

今回提案するのは、Androidで使用できるアプリケーションを使い、SDカードに入れて

いる服の画像を使用してコーディネートができるシステムである。パソコンでアプリケー

ションに表示させたい画像の背景を透明にし、SDカードに保存する。アプリケーションを

起動させ、トップスボタンをクリックすると SDカードに保存している服が一覧表示される。

コーディネートする服を選ぶとアプリケーションが SDカードを読み込みトップスの画像

がメイン画面の上部に表示される。同じく、ボトムズを選ぶとメイン画面の下部に表示さ

れ服をコーディネートすることができる。図 5にシステム全体の構造を示す。まず、シス

テムはメイン画面とサブ画面にわかれる。メイン画面ではコーディネート結果を表示させ、

サブ画面では、トップス一覧やボトムズ一覧を表示させて、それぞれのアイテムを選択す

る。

図 5システム全体像

8

第 2 節 詳細設計

本システムは、eclipseという統合開発環境に、Android SDKという、開発ツールをイ

ンストールし開発環境を整える。プログラムの言語は JAVAを使い、デザインのレイアウ

トは XMLを使用する。まず、メイン画面のレイアウトについて説明する（図 6）。

レイアウトはすべて XMLでプログラムされている。①の LinerLayoutはこの画面全体

のことを表している。②のボタン表示は、Buttonタグを使い表示する。③の ImageView

は、画像を表示させるタグである。また、gravity=”center”で画像を画面の中心へ表示させ

ることができる。表示させる画像は、SDカードから読み込むことで表示することができる。

SDカードから画像を読み込むプログラムについて図 7を使って説明する。

図 6 メイン画面

① <LinearLayout

android:id="@+id/LinearLayout01"

android:layout_width="wrap_content"

android:layout_height="wrap_content" >

<Button android:text="トップス"

android:id="@+id/Button01"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

>

</Button>

</LinearLayout>

<ImageView android:id="@+id/ImageView01"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_gravity="center">

</ImageView>

①

②

②

③

③

9

図 7の行番号 47~84は、SDカードのファイルを取得しファイル内にある画像を検索す

るプログラムである。行番号 48の on Createメソッドは、SDカードに保存されている画

像を検索し、on Createに画像パスを送る。その際、SDカードのファイルを取得するプロ

グラムは行番号 63～64である。次に、行番号 68~84は SDカード内の取得したファイルに

保存されている画像を検索する。検索された画像を選択すると、その画像パスが onCreate

に送られる。行番号 54~58が画像パスの保持するプログラムである。onCreateに画像パス

で送られてきた画像を表示するためには GridViewを使用する。行番号 90~93がメイン画

面に画像を表示させるプログラムになる。GridViewが画像を取得し、行番号 92

OnItemClickがmain classの onActivityResultメソッドを読み出す（図 8）。

図 7 SDからの読み出し

10

図 7のOnItemClickが図 8の onActivityResult読み出すことによりメイン画面に画像を

表示することができる。

図 8 main class 呼び出しメソッド

11

第 4章 検証

第１節 アプリケーション動作確認

本システムを使用する上で、メイン画面にサブ画面で選択した服を表示できるか実機

を使って動作確認を行う。

トップス選択する場合（図 9参照）、まずメイン画面にあるトップスボタンを選択すると

サブ画面に遷移する。コーディネートするトップス画像を選択すると、メイン画面に選ん

だトップスが表示され、画面上部に表示される。ボトムズもトップスと同じように選択す

ると（図 10参照）、画像がトップスの下に表示され、服をコーディネートすることができ

る。

図 9トップス選択の動作画面

図 10ボトムズ選択時の動作画面

12

第２節 問題点

本アプリケーション作成段階での問題点は、トップスとボトムズを選択する際に服

が画面の上下に表示されないという問題点が発生した（図 11）。

（1）XMLに画像表示位置を指定するプログラムを追加

LinearLayout内に Image Viewが１つしかなく、図 11のように画像が重なって表示

されてしまった。そこで、ImageViewをもう 1つ LinearLayout内に組み込むことにする

（図 12参照）。

図 11ボトムズ選択時の問題画面

図 12初期段階の XML

13

図 13の XMLをプログラムへ組み込み実行してみると、トップスとボトムズの位置は上

手く表示されるようになったが、トップスを選択（図 14参照）した後にボトムズを選択（図

15参照）すると、選んでいたはずのトップスが消えてしまい、2つの画像が同時に表示さ

れないという問題点が発生した。

図 13 ImageView02追加

図 14 トップス選択時の画面 図 15 ボトムズ選択時の画面

14

（2）メイン画面に画面遷移後も画像を残すプログラムの組み込み

（1）では問題を解決することはできなかった。そこで、次の解決策としてメイン画

面に画面遷移後も画像の値を保存する追加プログラムを組み込むことにする。

図 16の行番号 28の onSaveInstanceStateは、他の画面に移動する際に値を保存し、他

の Activityに移動する前に実行される。実行されることにより、トップスを選んだ後にボ

トムズ選択画面に行っても、メイン画面にトップスの画像の値を保存しているので、ボト

ムズを選びメイン画面に戻ると服が上下表示され、問題が解決することができた。

図 16 メイン画面

図 17 問題解決後のメイン画面

15

第３節 今後の展望

本アプリケーションは画像の処理をパソコン上で行っているので、パソコンはもちろん、

画像編集ソフトやこれらを扱う知識も必要になるのはアプリケーションとして使い勝手が

悪い。したがって，スマートフォンに搭載されているカメラ機能を利用し、撮った画像の

背景をスマートフォンのアプリ内で透明化にする処理が必要である。

本アプリケーションからカメラ機能が利用できるシステムを導入できれば、コーディネ

ートをする服をアプリ内に登録する作業の短縮になり、誰でも手軽に使用することができ

る。また、作業の効率化も図ることができる。カメラ機能を導入することで自分が持って

いる服に限らず、店で販売している服や、ファッション雑誌に載っている服をカメラで撮

影し、自分の持っている服とコーディネートすることが可能になり、服を購入する前に自

分の服と照らし合わせることもできる。

現在、トップスとボトムの 2種類しかコーディ

ネートすることができないため、アウターやワン

ピース、靴、アクセサリーも導入し、トータルコ

ーディネートを目標とする。アプリでコーディネ

ートした服をアプリ内に画像として保存できれ

ば、一週間分のコーディネートを決めることや、

自分が着用済みのコーディネートを把握するこ

とができる。また、本アプリケーションは、

AndroidOS搭載の端末しか利用できないため、

利用者数の多い iOSを搭載している iPhoneにも

対応することを目標とし、多くのスマートフォン

ユーザーが利用できるようにする。

図 18 iPhone

16

第５章 まとめ

近年、急激に普及しているスマートフォンは、さまざまな機能を追加できるアプリケー

ションというものがある。普及している理由として、アプリケーションを追加し、独自に

カスタマイズすることで、とても便利なものになることがあげられる。数あるアプリケー

ションの中に服をコーディネートするアプリケーションはあるが、自分自身が保持してい

る洋服を使ってコーディネートできるアプリケーションがないことに気がついた。独自に

カスタマイズすることで、とても便利なものになるスマートフォンなので、この機能を使

い、服をコーディネートするアプリケーションを開発した。

本システムは、Android OS搭載の小型端末機に装備できるアプリケーションである。

Androidアプリケーションの開発は、Android SDKのツールを組み込んだ統合開発環境の

eclipseを使用し、プログラムは Java言語と xmlを使用する。

システムの内容は、自分が保持している洋服をデジタルカメラなどで撮影し、ノートパ

ソコンに画像を取り込む。取り込んだ画像の背景をパソコン上で透明化にする。それをス

マートフォンの SDカードに保存する。アプリケーションを起動させ、洋服をコーディネー

トする際、洋服は SDカードに保存している画像を選ぶことでコーディネートができる。

現在、本システムはトップスとボトムズの上下しかコーディネートできないが、今後は

鞄や靴、アクセサリーなどのコーディネートもできることを目指す。また、コーディネー

トする画像はパソコン上で透明化をしないといけないので、これをスマートフォン上で透

明化できるようにする。そのためには、スマートフォンのカメラ機能を利用することによ

り可能になると考えている。

本システムはこのように将来性があり、機能性をあげることでより便利に誰でもコーデ

ィネートを楽しむことができると考える。

17

参考文献

[1] 神崎 洋治 ：「わかる！スマートフォンのすべて」日経 BP社

[2] 夏野 剛 ：「入門から業界動向までひと目でわかるスマートフォン」アスキー・

メディアワークス

[3] 堀切 堤 ：「スマートにプログラミング Android 入門編」リックテレコム

[4] Open Handset Alliance ：http://www.openhandsetalliance.com/

[5] Android Market ：https://market.android.com/

謝辞

本プログラムやプレゼン作成、発表などさまざまなご指導をして頂いた仙田友久氏に感

謝します。プログラム開発時に必要な環境を整えて頂いた尾花将輝氏に感謝します。同ゼ

ミでオープンキャンパスを一緒に盛り上げた河野竜太郎氏に感謝します。共にオープンキ

ャンパスを一緒に盛り上げた南雅隆氏に感謝します。学生懸賞論文を共に頑張った平健太

氏に感謝します。学生懸賞論文を共に頑張った真野友希氏に感謝します。一緒にバーベキ

ューをした鈴木寿和氏に感謝します。ゼミ長で飲み会などの仕切りをしてくれた山岡浩平

氏に感謝します。同ゼミの高萩大樹氏に感謝します。同ゼミの竹恵佑氏に感謝します。同

ゼミの田代江里氏に感謝します。同ゼミの原田敏志氏に感謝します。同ゼミの藤田雄樹氏

に感謝します。同ゼミの松井一紘氏に感謝します。最後に、プレゼン作成や、本論文の添

削やアドバイスなど、数々の指導をして頂いた花川典子教授に感謝します。