Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
よりアプリらしさを出すために
Search
おしん
December 13, 2024
Technology
1
87
よりアプリらしさを出すために
2024年12月13日(金)に主催したイベント『mobile.stmn』での登壇資料です。
おしん
December 13, 2024
Tweet
Share
More Decks by おしん
See All by おしん
Swift UI デフォルト引数クイズ
shincarpediem
1
97
Concurrency Warningが 沢山出たから聞いてほしい ~Xcode 16.1 Beta 編~
shincarpediem
1
190
iOSのPhoto Libraryアクセス権限を見直してみよう
shincarpediem
1
200
SwiftUI登場前のVIPERアプリでもSwiftUIをスムーズに導入できた話
shincarpediem
2
1.6k
VIPERアプリにSwiftUIを導入してみた
shincarpediem
1
400
Other Decks in Technology
See All in Technology
Amplify Gen2から知るAWS CDK Toolkit Libraryの使い方/How to use the AWS CDK Toolkit Library as known from Amplify Gen2
fossamagna
0
150
Enhancing SaaS Product Reliability and Release Velocity through Optimized Testing Approach
ropqa
1
250
ロールが細分化された組織でSREは何をするか?
tgidgd
1
160
SREのためのeBPF活用ステップアップガイド
egmc
1
780
開発生産性を測る前にやるべきこと - 組織改善の実践 / Before Measuring Dev Productivity
kaonavi
14
8k
大量配信システムにおけるSLOの実践:「見えない」信頼性をSLOで可視化
plaidtech
PRO
0
260
いつの間にか入れ替わってる!?新しいAWS Security Hubとは?
cmusudakeisuke
0
150
Four Keysから始める信頼性の改善 - SRE NEXT 2025
ozakikota
0
140
CDK Vibe Coding Fes
tomoki10
1
450
PO初心者が考えた ”POらしさ”
nb_rady
0
220
QuickSight SPICE の効果的な運用戦略~S3 + Athena 構成での実践ノウハウ~/quicksight-spice-s3-athena-best-practices
emiki
0
240
freeeのアクセシビリティの現在地 / freee's Current Position on Accessibility
ymrl
2
260
Featured
See All Featured
Rebuilding a faster, lazier Slack
samanthasiow
83
9.1k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
8
830
The Straight Up "How To Draw Better" Workshop
denniskardys
235
140k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
229
22k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
6
320
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
Gamification - CAS2011
davidbonilla
81
5.4k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
161
15k
Into the Great Unknown - MozCon
thekraken
40
1.9k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
5.9k
Designing for Performance
lara
610
69k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
48
2.9k
Transcript
「このアプリ、アプリっぽい!!!」 よりアプリらしさを出すために おしん(@38Punkd)
前提 01
前提 これから話すことは、あくまでモバイルアプリというハードウェアと その利用用途から考えた時に最適ではないUIUXがあるという話であって、 モバイルの方がWebよりも優れているという話ではないです モバイルもWebも、それぞれに長所短所があります モバイルアプリの長所を最大限活かす上で 「もっと改善できる」点を話していきます
『このアプリ、使いにくいな』 と思ったことはありませんか? 『このアプリ、 Webっぽいな』
理由があるんです
・画面が大きい ・座って操作 パソコン スマホ ・画面が小さい ・移動時に操作
・網羅性 ・閲覧性 ・画面が大きい ・座って操作 パソコン スマホ ・画面が小さい ・移動時に操作
・簡便性 ・即効性 ・網羅性 ・閲覧性 ・画面が大きい ・座って操作 パソコン スマホ ・画面が小さい ・移動時に操作
モバイルアプリケーション Webアプリケーション
・簡便性 ・即効性 ・網羅性 ・閲覧性 ・画面が大きい ・座って操作 モバイルアプリケーション Webアプリケーション パソコン スマホ
・画面が小さい ・移動時に操作
・簡便性 ・即効性 モバイルアプリケーション スマホ ・画面が小さい ・移動時に操作 モバイルアプリの 「体験」には 繰り返し行う行為 (=Task)を
素早く楽に操作できることが 求められる
『このアプリ、使いにくいな』 と思ったことはありませんか? 『このアプリ、 Webっぽいな』
『このアプリ、使いにくいな』 と思ったことはありませんか? 『このアプリ、 Webっぽいな』 繰り返し行う行為 (=Task)を 素早く楽に操作でき ...ない!!!
素早く楽な操作を 実現するための方法 ・アクセシビリティ ・ユーザビリティ https://developer.apple.com/design/human-interface-guidelines/accessibility
・アクセシビリティ ・Interactions ・Gesture ・Buttons and controls ・... ・VoiceOver ・... ・Text
Display ・Color an effects 素早く楽な操作を 実現するための方法 https://developer.apple.com/design/human-interface-guidelines/accessibility
素早く楽に操作を実現するための 『画面遷移』 02
画面遷移
画面遷移
画面遷移
画面遷移 ・スワイプバック ・戻るボタン
画面遷移 投稿の一覧 (≒タイムライン ) →投稿の詳細 という階層が存在
画面遷移 投稿の一覧 (≒タイムライン ) →投稿の詳細 という階層が存在 ユーザーはこの操作を 繰り返し行っている ユーザーにとって自然な流れは 一覧→詳細の前後関係が
存在していること
Before
Before
Before
Before
Before ???
After
After
After
After
After
🥳
素早く楽に操作を実現するための 『タブバー』 03
Before
Before
Before
After
After
After
After
最後に 04
「アプリっぽい」 「アプリっぽくない」 と感じる嗅覚はだいじ メッセージ 原因になっているUIUXを一つずつ改善していくことで アプリらしさが増していく
ありがとうございました!