読者です 読者をやめる 読者になる 読者になる

AppBank主催iPhoneアプリ勉強会に行ってきました

デザイン

AppBank主催iPhoneアプリ勉強会「iPhoneアプリ開発に役立つデザインを学ぶ」に行ってたので、
その忘れないうちにその内容と感じたことの一部を書いておこうと思います。
場所は先日4/26に梅田の北(ヨドバシの隣らへん)にオープンしたばかりのグランフロント大阪の会議室でした。
デザイナー向けのアプリ講座ということでUIやUXの話が多かったと思います。
聞きながら箇条書きで取ったメモを元に書いているので読みづらいところがたくさんあるとは思いますがご容赦下さい

  1. itok@いとーけー 伊藤氏「シンプルなアプリの作り方」
  2. Appliss 貝森氏「使いやすさ(UI)とここちよさ(UX)」
  3. PONOS 升田氏「果たして、 「にゃんこ大戦争」でiPhoneアプリ開発に役立つデザインはあるのか?」
  4. AppBank Spring_mao「誰でもできるUIデザインのポイント」

プログラムとしてはこんな感じだったのですが、1のitok@いとーけー 伊藤氏と2のAppliss 貝森氏のお話が印象に残ったので書いておこうと思います。

1.tok@いとーけー 伊藤氏「シンプルなアプリの作り方」

f:id:yulily100:20130427235138j:plain
いとーけーのページ

ツール系のシンプルなアプリを作いる方で製作の流れを紹介して頂きました。

(1)解決したい問題を整理する

誰が問題をかかえているか、その問題の規模や困難さを明確にし、「問題の本質」となるものを設定する。
問題の本質はどこにあるのかつねに考えておき、
その問題は機能の肥大化を防ぐために分割して整理しておく
アプリが肥大化してしまうと本当に解決したかった問題が不明瞭になり分かりづらくなる

(2)画面構成を考える

理想:1画面にほとんどすべての要素を盛り込んで、1タップで動作できるようにする
でも実際1タップで全て動作させるのは不可能なのでどれくらいの頻度で使う機能かを考え、
使う頻度が高くなればなるほどステップ数を少なくさせる
製作していると削らなければならない所が出て来る。
それのどこを削るかの判断の基準になるのが最初に設定した「問題の本質」
この「問題の本質」を元に最も重要な要素だけが残るようにする
そしてGUI(カメラappのシャッターボタンの場所とか・・・)は公開後に簡単にかえれらないことをしっかり考えておく!

(3)スパイスを加える(他のアプリとの差別化)

アプリがシンプルすぎるとリジェクトされてしまう(他にも似たようなアプリがあるから)
他のアプリとの差をつくるためには「スパイス」となるようなものが必要
例えば見た目としての綺麗さや、アニメーションの面白さや、色が自由に選択できるような機能など。
ただしスパイスの入れすぎには注意で、このときの判断も最初に決めた「問題の本質」を元に考えて行く。



アプリやwebサービスの制作過程で、(3)のスパイスを加える作業(こういう動き楽しいから入れたいなーとか)を考えていると、どうしてもその動作を目立たせることが第一になってしまって、本来の解決したいこととか目的が分からなくなってくると思う。
だから何のために作っているんだろう、という「迷ったときに立ち戻る場所」を最初にしっかり考えて置くのは大切だと感じた


2.Appliss 貝森氏「使いやすさ(UI)とここちよさ(UX)」

f:id:yulily100:20130428001614j:plain
Appliss
脱出ゲームcubic roomを作っている方でUIとUXの話をして頂きました。

UI(使いやすさ)について

ストレスを感じさせないためには、ほぼすべての動作を中心部で行えるようにすることが重要
片手で持って、親指で動かせる範囲が「中心部」
「よく使う順」に要素を画面上にふりわけていく
f:id:yulily100:20130427140317j:plain:w400
f:id:yulily100:20130427140416j:plain:w400
大切なのは「頻度」であり「重要度」ではない。
(終了ボタンは重要で必ず使うものだけど、このボタンを押す頻度は低く、画面の端でよい)

貝森さんはダンジョン内での画面移動の方法を「矢印ボタンのクリック」ではなく「画面のスワイプ」にした
(脱出ゲームというのはもとはweb上のものだったので移動は矢印ボタンのクリックで行っていたそう・・・)
スマートフォンアプリにおける矢印ボタンクリック移動による弊害

  • ボタンの存在が世界観を崩してしまう
  • 誤タップの誘発(矢印ボタンの近くに隠されているのでは?と思うユーザーがいるため)
  • 指の移動量が多くなってしまう、動線がふえる(スワイプなら画面のどこでもスワイプできるけど、ボタンだとその一ヶ所しか押せないので指の動きが増えてしまう)
UIまとめ

画面の真中で最低限の指の動きだけで思い通りの動きができるのが使いやすいUIである!
例えばsmartnewsというニュースアプリではスワイプでページめくることができる。
左上にある「戻る」ボタンというのは画面中央にないので超使いにくい

UX(ここちよさ)について

使いやすさのみならずユーザが真にやりたいことを気持ちよく動作させる!
cubic roomなら、非常にリアルなグラフィックとサウンドを使うことで
自分が「脱出」するという擬似体験をよりリアルに与える。
そしてそれがUX(ここちよさ)に繋がる
また「ヒントカード」というユーザーの手助けができる機能をつけておくことで、最終的にユーザに「謎がとける快感」を提供する
ただ難しいだけのゲームだと「謎がとける快感」は与えられない
(ヒントカードとは文字通りゲームのヒントなのだけれど、その文面も世界観にあった童話っぽいものを使うことで擬似体験をよりリアルにしている)




cubic roomというアプリを使ったことはなかったのだけれど、資料としてスライドに映し出されるグラフィックが本当にリアルでとてもびっくりした
cubic room (itunesに飛びます)
itunesiphoneスクリーンショットでもそのリアルさはわかると思う
また、音楽(ガチャガチャをひく音とかアイテムをゲットする音とか)のクオリティも非常に高かった。
何かをタップしたときのフィードバックとして見た目が変化するのはもちろんだけれど
音としてのフィードバックがあれば「心地よさ」は格段に上がると思った
(このゲームの音楽はガレージバンドでいろんな音を出してみて、一番心地よい音を使っているとのこと!!!)





この講演会はグランフロント前をたまたま通りすがって見つけた・・・っていう感じだったのですが、飛び入りでも参加できて助かった・・・
講演ききにきてる制服姿の女子高生とか何者なんだろう
大学生は自分以外にもちょいちょいいたと思う

デザインがどうとかの勉強会だったけど参加者ほとんどエンジニアだった


f:id:yulily100:20130426161156j:plain:h400

個人的にグランフロントの3Dプリンタとっても気になります
(月にいくらか払って会員になったらあとは自由に使えるらしい)
あとはキルフェボンとクライミングジムいきたいな




ルンバ!(ルンルン!!!!!)