4月27日(土)にAppBank Network主催の勉強会が、グランフロント大阪のタワーB10階にて行われました。
今回のテーマは「iPhoneアプリ開発に役立つデザインを学ぶ」。様々なユーザーに長く使われるデザイン・UIのアプリを開発する方法を教えて頂きました。
ご講演：iPhoneアプリ開発に役立つデザインを学ぶ
以下の4人の方にご登壇して頂きました。
- itok＠いとーけー氏「シンプルなアプリの作り方」
- Appliss 貝森氏「使いやすさと心地よさ」
- PONOS 升田氏「果たして、 『にゃんこ大戦争』で iPhoneアプリ開発に役立つ デザインはあるのか?」
- AppBank spring_mao氏「誰でもできるUIデザインの ポイント」
パネルディスカッション
事前に募集した質問を、ご講演者から自由に回答して頂きました。また、会場からの質問も受け付けました。司会は「マックスむらい」ことAppBank 村井氏。
「グランフロント大阪」にて開催
今回の勉強会は、4月27日(土)に、グランフロント大阪に「AppBank Store うめだ」がオープンしたことを記念して行われました。
店舗レポートはこちら！
【順次更新中！大阪】本日オープン！AppBank Storeうめだへようこそ！
AppBank Store うめだはグランフロント大阪の北館2階にあります。
JR大阪駅からの詳細な行き方を、こちらの記事でご紹介します。
AppBank Storeうめだ: 駅から店舗への道順を解説。写真付きガイドで迷わず行ける！
それでは貴重な講演の内容を、ピックアップしてレポートします！全部聞きたいと思った方は、ぜひ次回の勉強会にご参加下さい。
itok@いとーけー 伊藤氏「シンプルなアプリの作り方」
最初にご登壇いただいたのは、個人でツール系アプリを多数リリースしている「いとーけー」こと伊藤氏です。
アプリのレビューはこちら
PictShare – multiple photos uploader: 12のサービスに写真を投稿できるアップローダー。簡単な編集にも対応。923
伊藤氏には「シンプルなアプリの作り方」というテーマでご講演して頂きました。伊藤氏が強調されたポイントは以下の3つ。
- 解決したい問題を整理する
- 画面構成を考える(一望性とステップ数)
- スパイスを加える
アプリの元となった問題の本質から外れない
「ツール系アプリは、何かの問題を解決するためにある。その問題を整理し、本質を常に忘れないことが重要である。」ということでした。
アプリデザインにおいても、問題の本質を念頭に置くことで機能の肥大化を防ぎ、結果的にシンプルで使いやすいアプリができる。と語られました。
スパイスを加える。ただし入れ過ぎには注意！
印象的だったのは「スパイスを加える」というお話でした。いくら問題の本質をとらえていても、シンプル過ぎるアプリは既存のアプリと区別がつかなくなります。そのために「隠し味的な要素を加えると良い」そうです。
しかし「解決したい問題を見失わないように、スパイスを入れ過ぎないこと」という注意点も挙げられました。アプリ開発を料理に例えた、とても深いお話でした。
Appliss 貝森氏「使いやすさと心地よさ」
「脱出ゲーム CUBIC ROOM」シリーズで有名なAppliss 貝森氏にはアプリの「使いやすさ(UI)と心地よさ(UX)」をテーマにしたご講演をして頂きました。
貝森氏は美術大学卒業を経て、工業デザイナーとして勤務された経験をお持ちです。デザイナーという視点からの興味深い講演を聞くことができました。
貝森氏のアプリレビューはこちら
- 脱出ゲーム CUBIC ROOM: リアルなグラフィックとサウンドがイイ、上質な脱出ゲーム。無料。
- 脱出ゲーム CUBIC ROOM2: 美麗な脱出ゲームの第2弾！今回は教室からの脱出で歯ごたえアップ。無料。
使いやすさ(UI)は「ストレスを感じさせない設計」にする
貝森氏は操作ボタンの配置にこだわっていると説明されました。親指の可動領域に着目し、ほぼ全ての動作を画面中心部で行えるようにしたそうです。
貝森氏のさらなるこだわり「グラフィックとサウンド」
次に貝森氏はユーザーにとっての楽しさ・心地よさ(UX)について説明されました。ユーザーが楽しいと思えるために「グラフィックとサウンド」にこだわったそうです。
なんと「CUBIC ROOM」のグラフィックは全て3Dで作っておられるという衝撃的な事実を発表されました！Toshism氏がずっと実写だと思っていた程の、ハイクオリティなグラフィックを一人で手がけるとは驚きです。
またサウンドについて、CUBIC ROOMで登場するゴリラの鳴き声は貝森氏自身の声マネ(！)であると語られました。
努力を惜しまないこだわりが、アプリのヒットに繋がっているのだと実感できるご講演でした。
PONOS 升田氏「果たして、 「にゃんこ大戦争」で iPhoneアプリ開発に役立つ デザインはあるのか?」
大ヒット中の防衛ゲーム「にゃんこ大戦争」のデザインを手がけた升田氏には、インパクト大なキャラにスポットを当てたご講演をして頂きました。
にゃんこ大戦争の攻略ページはこちら
大人気ゲーム「にゃんこ大戦争」の情報まとめページ！
「にゃんこ大戦争」は誰でもマネできる！思いつきで押しきれ！
にゃんこ大戦争には、様々なネコキャラが登場します。それらは全てシンプルな発想で思いついたものをそのまま採用したそうです。
発想の一例
- タテとなるキャラクター → ヌリカベ風、デブキャラ
- 攻撃力の高いキャラ！ → 顔面にキズがある。
- 動きの速いキャラ！ → 馬(後に牛になる)
- 超かっこいいキャラクター → ドラゴン
この思いつきをを軽視せずに膨らませたことで、あのゆるくキモカワな世界観が生まれたのだと理解できました。
大切なのは「にゃんこだけ」を目立たせること
せっかく思いついたキャラクター活かすために、升田氏は「周りのレベルを下げることによって、にゃんこの面白さが際立つようにした」そうです。
実例として、インターフェイスをとことんダサくした！と語っておられました。背景やフォントを意図的に目立たなくすることで、キャラクターに焦点が合うようにされたそうです。
必要なものまで削っちゃえば？
さらにキャラクターを目立たせるために、一般的にゲームアプリで必要と思われるものまで無くしたそうです。その潔さが、結果的ににゃんこ大戦争の面白さを伝えるのに役立ったとのことでした。
実例の一部
- 体力ゲージ(バトルに没頭できるようにした。)
- キャラのステータス(レベルと説明のみにした。)
「引き算の法則」と言えそうな、目からウロコの講演でした。
AppBank spring_mao氏「誰でもできるUIデザインのポイント」
最後に登壇したのは、我らがAppBankのアプリ担当、spring_mao氏！彼女は以下の2つのテーマについて話してくれました。
- アップデートで改善した3つの事例
- おまけ：ディレクターというお仕事
何も書いていない場所は、お母さんはタップできません！
最初にspring_mao氏は「アプリのUIを設計するときは、そのアプリを使う人を想定する」と語りました。そして、アプリのアップデートで明らかになったユーザーの特徴について、例を交えながら説明しました。
一つ目の例は「おてがる天気」という天気予報アプリです。このアプリのターゲットは、iPhoneアプリに詳しくないお母さん層だそうです。
前の画面に戻る機能を実装するときに、画面のどこをタップしても戻れるようにしていたそうです。しかし、ユーザーから「戻る方法がわからない」という意見を受けるようになりました。ここで初めて、そのUIがお母さん層にはふさわしくないことに気づいた。とのことでした。
spring_mao氏はこの失敗により、「何も書いていない場所は、お母さんはタップできない」という教訓を得て「戻る」ボタンを設置したと語りました。
ディレクターという仕事とは
spring_mao氏は講演の最後に、彼女の「ディレクター」という仕事について説明しました。
アプリ開発のディレクターをひと言で説明すると「形にしてひとつひとつを確認していく作業」。最初にアプリの方向性を決めますが、プログラマーやデザイナーなど、色々な人の意見を取り入れながらアプリを開発します。
しかし、どの意見を採用するかはspring_mao氏が決定するので責任のある仕事である、と説明しました。
AppBank Networkのご紹介
AppBank Network主催の勉強会ということで、AppBankの尾崎(しょーざ)より、AppBank Network、及びAppBankプラスの紹介を致しました。
AppBank Networkは、ディベロッパーの悩みの種である「収益やプロモーション」をサポートします。
「AppBankプラス」はAppBank Networkをご利用頂いているアプリを、AppBank内で紹介するサービスです。
AppBankプラスをご利用頂くことで、アプリを以下の3箇所で紹介致します。
- 無料アプリランキング
- お昼のセール情報
- 無料アプリコーナー
AppBankプラスを利用したことで、実際にPV、iTunesリンクのクリック数が増えた事例をご紹介しました。ぜひ導入をご検討下さい！
AppBank Network – iPhone、iPadアプリの収益化を実現する広告ネットワーク
パネルディスカッション
最後に、ご講演いただいた皆さんにパネルディスカッションで色々な質問をさせて頂きました。マックス村井氏の司会で、終始和やかな雰囲気で行われました。
ご講演者の方々は、それぞれ回答に違う視点で答えられていました。私が印象深いと感じた回答を、いくつか抜粋してお届けします！
質問1：デザインが優れていると感じるアプリとその理由を教えてください！
PONOS 升田氏「Mr.shapeのタッチカードという、知育ゲームです。カードを選んだときのアクションの一つ一つに、全てオチが付いているところに良さを感じます。」
アプリレビューはこちら
[iPad, iPhone] Mr.shapeのタッチカード: いろんなカードで遊べて楽しい知育ゲーム。無料。
AppBank spring_mao氏「パズル＆ドラゴンズです！グラフィックをアピールし過ぎて、見辛いUIのゲームアプリが多い中で、パズドラはその逆だと思います。ダンジョンの情報は名前しか与えない部分に、ゲームを楽しませる工夫を感じました。」
パズドラの攻略ページはこちら！
【パズドラ攻略】パズル&ドラゴンズの上達法・攻略情報まとめ
質問2：アプリ開発。デザイン設計から始める?それとも作り出してから良いデザインへと修正していく?
itok@いとーけー 伊藤氏「ほとんど出来上がった時点でデザイナーさんにお願いします。その後デザイナーさんから逆提案を受けて、機能を変更したりします。」
Appliss 貝森氏「最初に演出を考えて、そこからデザインを決めます。CUBIC ROOMでは、部屋が回転して新しく生まれ変わったら面白いなと考えたことにより、正方形の部屋を思いつきました。」
他にも会場から質問を募集しました。中にはこんな質問もありました。
会場からの質問：明日世界が滅びるとして、どんなアプリを作りたいですか？
itok@いとーけー 伊藤氏「世界滅亡カウントダウンアプリですね。あと1時間だけど、これやりますか？みたいな通知を出そうと思います。」
Appliss 貝森氏「あと1日しか無いなら、アプリを作らないで遊び倒しますね。」
PONOS 升田氏「にゃんこ大戦争で癒しのキャラを追加します！」
AppBank spring_mao氏「AppBankのアプリです。わたしがやるべきアプリはそれだと思います。」
最後に、締めのひと言をお一人ずつ頂いて終了となりました！
以上が今回の勉強会内容です。
公演後は、短い時間の中で名刺交換会が行われましたが、こちらも終了時間ギリギリになっても盛り上がっていました。
今回、ご講演してくださった方々、そして参加して下さった皆様、本当に有難うございました。AppBank Network主催の勉強会は、定期的に開催しております。気になった方はぜひご参加下さい！
