1. The influence of app screenshot
on the formation of aesthetic impression
- Focusing on the iOS -
Minsoo Byun, Kwangil Ju, Junho Choi
Digital Cultural Content/UX Track,
Graduate School of Information,
Yonsei University, Seoul, Rep. of Korea
© Content UX Lab., Yonsei University, 2013

2. Introduction Background Research Design Results Conclusion
The influence of app screenshot
on the formation of aesthetic impression
- Focusing on the iOS -

3. Introduction Background Research Design Results Conclusion
The issues of app screenshots

4. Introduction Background Research Design Results Conclusion
App scam (e.g. Minecraft)
Icon
App Scam YouTube Video Capture
Screenshot

5. Introduction Background Research Design Results Conclusion
Apple’s new policy for preventing app scam
It is extremely important to design the first screenshot of an app because users now
download & purchase the app based on visual impression, not on details & textual
descriptions.

6. Introduction Background Research Design Results Conclusion
Younger generation likes image information better than texts
3 factors of iOS app installation (by age)
10’s 20’s 30’s 40’s 50’s +
Description
Screenshot
Paid/Free
Developer
Ranking
Review
Rating
Icon
Title
3 factors of Android app installation (by age)
10’s 20’s 30’s 40’s 50’s +
Downloads
Paid/Free
Description
Screenshot
Developer
Ranking
Review
Rating
Title
Icon
KTH Mobile Report (2012. 1Q)

7. Introduction Background Research Design Results Conclusion
How they look like on the screen (e.g. Facebook)
Desktop (iOS) Desktop (Android)
iPhone 4 (iOS) Nexus S (Android)

8. Introduction Background Research Design Results Conclusion
Why is it important?

9. Introduction Background Research Design Results Conclusion
A plenty of apps
775,000 300,000 675,000
apps to iOS devices (2013.01) native iPad apps (2013.01) apps on Google Play (2012.09)
App Discovery

10. Introduction Background Research Design Results Conclusion
Apple acquired app discovery startup
App screenshots have become crucial
in people’s purchasing decision in the
app market these days.
• • • 2011 • • • • • • • • • • • • 2012 • • • • • • • • • • • • 2013 • • •
[iOS 5: Sorting Page] [iOS 6: Sorting Page]
a table view a card view
4-5 apps only 1 app
only icons primary screenshot
vertical listing horizontal listing
[App Detail Page] [App Detail Page]
text-based screenshot-centered
unadorned beautifying
informational promotional

11. Introduction Background Research Design Results Conclusion
Overview of this study
Theme visual impression of app screenshot
Participants 20’s mainly
Focus iOS Apple iTune App Store

12. Introduction Background Research Design Results Conclusion
Literature review
It is hard to find
any clear definition of
‘app screenshot’
in academic research
but only
in some dictionaries.

13. Introduction Background Research Design Results Conclusion
Definition of Screenshot
Main Entry: screen·shot
Pronunciation: ˈskrēn-ˌshät
Function: noun
Date: 1983
A screen dump, screen capture (or screen-cap), screenshot (or
screen shot), screengrab (or screen grab), or print screen is an
image taken by the computer user to record the visible items
displayed on the monitor, television, or another visual output
device. (omitted)
Screenshots can be used to demonstrate a program, a particular
problem a user might be having, or generally when display output
needs to be shown to others or archived.
A frame of television or video footage that is digitized and stored
as a still image for subsequent display, editing, or printing.

14. Introduction Background Research Design Results Conclusion
App Screenshot Guidelines
The first screenshot that you upload is the first screenshot that appears
on your app product page on the App Store and the device App Store when
viewed from the iPhone and iPod touch. Up to four additional optional
screenshots can be uploaded. All subsequent screenshots will appear in
numbered order on the App Store, in the same order in which they were
uploaded in iTunes Connect. Only Newsstand apps can reorder their
screenshots after they have been uploaded.
The different graphic assets we request are used to highlight and promote
your application in Google Play, and possibly other Google-owned
properties. If you’d like to restrict the marketing of your app to just Google
Play, you have the option of opting-out of marketing by selecting the
"Marketing Opt-Out" in the Developer Console.
Screenshots (Required):
- We require 2 screenshots.
- You may upload up to 8 screenshots. (omitted)
Show off unique and engaging parts of your app, and demonstrate how the
app is social. Don't use images that are unrelated, misleading, or
dramatically different from what most users experience. Screenshot should
not contain marketing copy, bulleted lists of features or calls to action e.g.
"Click here to play the game!". Websites with Facebook Login must include
at least one screenshot indicating a personalized user experience.

15. Introduction Background Research Design Results Conclusion
Operational Definition of App Screenshot
‘App screenshot’ is an image displayed by the app
developers to highlight the visible features on the screen.
It can be used to demonstrate an app’s key features and
interface design in the app market.
It is a window of promotion to get user’s attention.

16. Introduction Background Research Design Results Conclusion
Classification of App Screenshot
graphic GUI
Website text Screenshot description
(Desktop) (Mobile)
effect retouch
Neil, Barrett, Advertising on the internet, Kogan Page

17. Introduction Background Research Design Results Conclusion
Classification of App Screenshot
GUI
Screenshot description
(Mobile)
retouch
Combinations: SCREENSHOT (UI) x TEXT (description) x EFFECT (distortion)

18. Introduction Background Research Design Results Conclusion
6 Types of App Screenshots * Apple iTunes App Store (Korean market)
Graphic UI
(original screenshot)
Texts
A
type
B
type
C
type
D
type
E
type
F
type
effects

19. Introduction Background Research Design Results Conclusion
6 Types of App Screenshots: Treatments (A, B, C)
pure
A
type screenshot
screenshot
+
B
type highlighting
effect
(e.g. loupe effect)
text
screenshot
C
type
+
instruction

20. Introduction Background Research Design Results Conclusion
6 Types of App Screenshots: Treatments (D, E, F)
text screenshot
+
D
type
text
+
effect
(character)
text
screenshot
+
E
type
text
+
effect
2nd 3rd (panoramic)
screenshot screenshot
screenshot
+
text
F
type
+
effect
= complex

21. Introduction Background Research Design Results Conclusion
Emotional vocabulary analysis by Semantic Differential Method
voca. sub vocabulary
기쁜 명랑한, 발랄한, 재미있는, 경쾌한 vocabulary (5 pairs)
깨끗한 가벼운, 깔끔한, 맑은, 밝은, 섬세한, 여성적인
static dynamic
온화한 매끄러운, 소박한, 수수한, 인상적인, 촉촉한 1
(정적인) (동적인)
귀여운 싱그러운, 아기자기한, 즐거운
내추럴한 감미로운, 감성적인, 달콤한, 자연적인, 향기로운 simple varied
2
은은한 그윽한, 정돈된, 정적인, 조용한, 심플한 (단순한) (복잡한)
우아한 고급스러운, 동양적인, 멋진, 세련된, 품위 있는
rich plain
화려한 다양한, 매력적인 장식적인, 성숙한, 풍성한 3
(화려한) (수수한)
점잖은 견실한, 부수적인, 고전적인, 중후한
고상한 지적인, 차분한, 분위기 있는 detailed disorganized
4
모던한 견고한, 세련된, 진보적인, 도시적인, 현대적인 (정교한) (허술한)
싫어함 불안정한, 불편한, 어색한, 답답한
bright dark
거칠은 딱딱한, 오돌토돌한, 불쾌한, 반투명한 5
(가벼운) (무거운)
부드러운 매끄러운, 매혹적인, 평온한, 잔잔한
* Self Assessment Manikins / Likert scale (7)
* References: HCI Introduction (Jinwoo Kim) and other studies using S.D. method
Jungsun Yoon(2000), Hyesuk Park, Jungsuk Yoon(2001), Kyungsuk Kim, Yeonsuk Lee(2004),
Sujin Park, Woohyun Jung, Jaehyun Hahn, Sujin Shin(2004), Saebom Kim(2007), Hyunwon Jung(2008), Jongmoo Kim, Sunghoon Kim(2009)

22. Introduction Background Research Design Results Conclusion
Focus Group Interview
- Goal
to find out insights from the survey in detail
- Groups
iOS user Android user
gender M F M F
number 1 1 1 1
sum 4
- What we did
pre-interview
informed consent
collect personal information
semi-structured in-depth interview
post-discussion

23. Introduction Background Research Design Results Conclusion
Results
1 2 3 4 5 6 7
Calm Dynamic
Simple Varied
Rich Plain
Detailed Disorganized
Bright Dark
A-Type B-Type C-Type D-Type E-Type F-Type

24. Introduction Background Research Design Results Conclusion
Results: Case 1
Case of original and highly retouched screenshots (no vs. strong retouching)
A
type
F
type
App market consumers perceive different impressions
between A-Type(plain original) and F-Type(highly retouched images).
1 2 3 4 5 6 7
Calm Dynamic
Simple Varied
Rich Plain
Detailed Disorganized
Bright Dark

25. Introduction Background Research Design Results Conclusion
Results: Case 2
Case of moderately vs. strongly retouched screenshots
C
type
D
type
Consumers hardly perceived different impressions between
plain screenshots(C-Type, D-Type) and somewhat strongly retouched images
1 2 3 4 5 6 7
Calm Dynamic
Simple Varied
Rich Plain
Detailed Disorganized
Bright Dark

26. Introduction Background Research Design Results Conclusion
Results: FGI
The factors of making differences visual impressions of app screenshots are
color, layout, font, quality of image
“Visual look and feel of app screenshots are “Sometimes it looks good because I can see
important. However, I have expectation about something more visualized infos than just
apps when I look at some app screenshots. captured image. Noise is much better.”
because I want to know its function and
usefulness from the screenshots. So I think the
“I don’t understand its layout, if I were designer,
most important thing is the ability to check out
I would get rid of the devices but full capture
the original interfaces at first.
images. Oh, I didn’t recognize the texts on it.”
“In this case, texts are not crucial elements for “It looks, I don’t know but I can understand
understanding its function. Plus, font size is what it looks like. Not any more.”
too small so bad readability.”
“It looks good because of using color of them.
“Too many information in them, very confused Sky blue and yellow look more friendly and
so I don’t know what this app can do. Terrible.” comfortable. But I don’t want to download it we
have lots of similar apps!”
“In this case, I hate the font they use. And it
looks like old-fashioned app so I can’t even feel “Usually I like characters so these screenshots
any attractive emotion. Just creaky.” make me positive and happy.

27. Introduction Background Research Design Results Conclusion
Implications
- Most App market consumers want to check out
the original interface by browsing the app screenshots
before they download on the market
- For promoting an app effectively, it is better
to design the Graphic User Interfaces(GUI)
than fancy app screenshots

28. Introduction Background Research Design Results Conclusion
Further Study
- The more samples are needed for the future research
- This study sample is 20’s, so we will collect more data from the other age groups
- Further study will include user’s background and usage patterns because artists
and designers have the knowledge of aesthetics.
- We focused only on Apple’s iTunes App Store, so next step will be comparing iOS
with Android
- Those 9 type of app screenshots were collected in all categories. We are going to
investigate the genre effect of different app categories.

29. Q&A