子供向けアプリを作るときに気をつけていること

Yoshiyuki Higo
Yoshiyuki HigoSoftware Developer
子供向けアプリを作るときに
気にしていること
YOSHIYUKI HIGO
2018.06
迷わないか
1
やってほしいことへ導く工夫
まずはプレイしてほしいから
スタートボタンだけ
ボタンだけだと楽しそうに見
えないためタイトルロゴなど
で賑やかしたいが、ロゴが読
めない年齢の子供も対象なの
で、代わりにネコで中央のボ
タンを囲って賑やかしとボタ
ンの強調の両方を実現。
ネコはタップすると逃げるの
で最後はボタンのみが画面に
残り必然的にプレイに進む。
また、試した人にネコをタッ
プするというルールを伝えて
いる。
進捗に応じてやれることを増やす
コレクションが増えた
最高得点が記録された
わかるか
2
文字や記号がわからない
OKがわからない 矢印がわからない
矢印でナビゲートしても…
OK
ナビゲートするときの気配り
アウトラインの強さやサイズの大小で強弱をつける
拡大縮小や上下移動などのアニメーションをつける
重なりがわからない
背景
ポップアップ
画面を平面にとらえて
いるのでレイヤー構造
が理解できない。
透過していると情報が
重なって混乱する。
ポップアップを出すときの気配り
全画面 背景
ポップアップ
全画面にして他の情報を
隠すことで混乱をふせぐ
位置や操作にあったズームやフェードなどの
アニメーションをつけて相関性をわからせる
疲れないか
3
情報量は適切か
白背景の情報を仮にゼロと
すると、背景に色がついた
瞬間に「色」という情報が
加わったことになる。
文字だけでなく色や線も情報と考える
テキスト テキスト テキスト テキスト
同じことを伝えるだけでも情報量がちがう
断捨離して強弱をつける
すごく見せたいこと
見せたい2 見せたい3
タイトル
そこそこ見せたいこと
すごく見せたいこと
見せたい2 見せたい3
本当に必要なものはなにか
同時に見せる必要があるか
情報が多いと難しくて疲れる 情報が少ないと簡単で疲れない
動かすべきか
4
動かしすぎると
なにもかも動いていると気が散って
なにをすればよいかわからなくなる
A
B
C
まったく動かさないと
動きをなくすとおちついて使えるが画面が
死んでしまうと子供が興味を示さなくなる
A
B
C
死んだ画面にしない工夫
おしてほしいボタンを
アニメーションで登場
させて注目させる
ボタンの停止後にねずみを
画面の隅から登場させて、
画面に興味を向ける。
ねずみはタップすると逃げ
たりする。子供のアクショ
ンに対してリアクションを
さぼらない。
ゲームでよく見る死んだ画面にしない小技
背景をスクロール
スコア
12,345
エフェクトをループUIのアニメーション
スコア
12,345
※ゲーム以外に適用しづらいが、キャラクターのまばたき、呼吸、髪揺れなどもよく見られる
速さと動き
5
速度による印象
速いとキビキビと使えるが目まぐるしくあわてさせる
遅いとおちついた印象になるが慣れるとまどろっこしい
イージングを使い分ける
Elastic、Bounce、Backはポップで元気なモーションになる
LinearやQuadraticはシンプルでクセのないモーションになる
見た目
6
内容をふまえた見た目
ツール系の難しさをアウトラインのない
やわらかいアートとシンプルなUIで軽減
学ばせたい実写のお金にラフな
アートを加えて手に取りやすく
対象にあわせた見た目
お母さん(大人の女性)がかわいいと
感じるキュートな絵に木目調で上品に
子供がプレイするのでアウトラインを
強くしてポップでキラキラで賑やかに
機能をふまえた見た目
ゲームプレイに直接関係するフルーツと
バスケットはアウトラインをつけている
皮が赤く中身が黄色いリンゴで
時間の経過量と残量が一目瞭然
子供に使ってもらう気持ちで作れば
だれでも楽しく使えるものができる
終
1 of 26

Recommended

Local anaesthetic agents by
Local anaesthetic agents Local anaesthetic agents
Local anaesthetic agents Dr.Arka Mondal
818 views42 slides
ChatGPT and the Future of Work - Clark Boyd by
ChatGPT and the Future of Work - Clark Boyd ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd Clark Boyd
25.3K views69 slides
Getting into the tech field. what next by
Getting into the tech field. what next Getting into the tech field. what next
Getting into the tech field. what next Tessa Mero
6K views22 slides
Google's Just Not That Into You: Understanding Core Updates & Search Intent by
Google's Just Not That Into You: Understanding Core Updates & Search IntentGoogle's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search IntentLily Ray
6.5K views99 slides
How to have difficult conversations by
How to have difficult conversations How to have difficult conversations
How to have difficult conversations Rajiv Jayarajah, MAppComm, ACC
5.2K views19 slides
Introduction to Data Science by
Introduction to Data ScienceIntroduction to Data Science
Introduction to Data ScienceChristy Abraham Joy
82.4K views51 slides

More Related Content

Featured

Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright... by
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...RachelPearson36
12.7K views21 slides
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present... by
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...Applitools
55.5K views138 slides
12 Ways to Increase Your Influence at Work by
12 Ways to Increase Your Influence at Work12 Ways to Increase Your Influence at Work
12 Ways to Increase Your Influence at WorkGetSmarter
401.7K views64 slides
ChatGPT webinar slides by
ChatGPT webinar slidesChatGPT webinar slides
ChatGPT webinar slidesAlireza Esmikhani
30.4K views36 slides
Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G... by
Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...
Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...DevGAMM Conference
3.6K views12 slides

Featured(20)

Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright... by RachelPearson36
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
RachelPearson3612.7K views
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present... by Applitools
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Applitools55.5K views
12 Ways to Increase Your Influence at Work by GetSmarter
12 Ways to Increase Your Influence at Work12 Ways to Increase Your Influence at Work
12 Ways to Increase Your Influence at Work
GetSmarter401.7K views
Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G... by DevGAMM Conference
Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...
Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...
DevGAMM Conference3.6K views
Barbie - Brand Strategy Presentation by Erica Santiago
Barbie - Brand Strategy PresentationBarbie - Brand Strategy Presentation
Barbie - Brand Strategy Presentation
Erica Santiago25.1K views
Good Stuff Happens in 1:1 Meetings: Why you need them and how to do them well by Saba Software
Good Stuff Happens in 1:1 Meetings: Why you need them and how to do them wellGood Stuff Happens in 1:1 Meetings: Why you need them and how to do them well
Good Stuff Happens in 1:1 Meetings: Why you need them and how to do them well
Saba Software25.2K views
Introduction to C Programming Language by Simplilearn
Introduction to C Programming LanguageIntroduction to C Programming Language
Introduction to C Programming Language
Simplilearn8.4K views
The Pixar Way: 37 Quotes on Developing and Maintaining a Creative Company (fr... by Palo Alto Software
The Pixar Way: 37 Quotes on Developing and Maintaining a Creative Company (fr...The Pixar Way: 37 Quotes on Developing and Maintaining a Creative Company (fr...
The Pixar Way: 37 Quotes on Developing and Maintaining a Creative Company (fr...
Palo Alto Software88.4K views
9 Tips for a Work-free Vacation by Weekdone.com
9 Tips for a Work-free Vacation9 Tips for a Work-free Vacation
9 Tips for a Work-free Vacation
Weekdone.com7.2K views
How to Map Your Future by SlideShop.com
How to Map Your FutureHow to Map Your Future
How to Map Your Future
SlideShop.com275.1K views
Beyond Pride: Making Digital Marketing & SEO Authentically LGBTQ+ Inclusive -... by AccuraCast
Beyond Pride: Making Digital Marketing & SEO Authentically LGBTQ+ Inclusive -...Beyond Pride: Making Digital Marketing & SEO Authentically LGBTQ+ Inclusive -...
Beyond Pride: Making Digital Marketing & SEO Authentically LGBTQ+ Inclusive -...
AccuraCast3.4K views
Exploring ChatGPT for Effective Teaching and Learning.pptx by Stan Skrabut, Ed.D.
Exploring ChatGPT for Effective Teaching and Learning.pptxExploring ChatGPT for Effective Teaching and Learning.pptx
Exploring ChatGPT for Effective Teaching and Learning.pptx
Stan Skrabut, Ed.D.57.7K views
How to train your robot (with Deep Reinforcement Learning) by Lucas García, PhD
How to train your robot (with Deep Reinforcement Learning)How to train your robot (with Deep Reinforcement Learning)
How to train your robot (with Deep Reinforcement Learning)
Lucas García, PhD42.5K views
4 Strategies to Renew Your Career Passion by Daniel Goleman
4 Strategies to Renew Your Career Passion4 Strategies to Renew Your Career Passion
4 Strategies to Renew Your Career Passion
Daniel Goleman122K views
The Student's Guide to LinkedIn by LinkedIn
The Student's Guide to LinkedInThe Student's Guide to LinkedIn
The Student's Guide to LinkedIn
LinkedIn88K views
Different Roles in Machine Learning Career by Intellipaat
Different Roles in Machine Learning CareerDifferent Roles in Machine Learning Career
Different Roles in Machine Learning Career
Intellipaat12.4K views

子供向けアプリを作るときに気をつけていること