Browse > Article
http://dx.doi.org/10.5392/JKCA.2021.21.02.148

A Study on UI Design Trends Analysis with Neumorphism Design  

Park, Ji-Hye (중앙대학교 첨단영상대학원)
Oh, Na-Yea (중앙대학교 첨단영상대학원)
Park, Jin-Wan (중앙대학교 첨단영상대학원)
Publication Information
The Journal of the Korea Contents Association / v.21, no.2, 2021 , pp. 148-160 More about this Journal
Abstract
Although a great deal of research has been carried out recently with the rise of importance of the UI design, little research has been conducted on the new Neumorphism design. Given the paucity of the research, we demonstrated the development process of GUI design, focusing on the UI design trends, Skeuomorphism, Flat, Material design and the emerging Neumorphism design. Based on this, the aim of the study is to look into the possibility of Neumorphism design, which is currently drawing attention, as the new UI design trends. This study was ordered as follows in two ways. First, drawing from the work of literature, we illustrated the UI design trends by considering the Skeuomorphism, Flat, and Material Design which were before the advent of the Neumorphism design. In addition, we conducted a study on the characteristics and limitations of the UI design trends through actual cases in which UI designs were applied. Second, the Material design as the most recent UI design trends and the Neumorphism design were compared with the method of expression based on the definition and characteristics of Neumorphism design that we investigated. In this context, we also analyzed the possibility of Neumorphism becoming the new UI design trend. We proposed an application of the design to maximize the benefits. This study is meaningful in that the Neumorphism design, which has yet to be studied, is likely to become the UI design trends in the future.
Keywords
Interface Design; Graphic User Interface; Neumorphism;
Citations & Related Records
연도 인용수 순위
  • Reference
1 박지수, 김헌, UX 디자인 7가지 비밀, 안그라픽스, 2013.
2 https://terms.naver.com/entry.nhn?docId=1179975&cid=40942&categoryId=32842, 2020.09.28.
3 박선아, 박승호, "아이콘 디자인의 구체성과 추상성에 관한 연구 - 모바일 애플리케이션 아이콘을 중심으로 -," 디자인융복합학회, 제13권, 제5호, pp.199-217, 2014.
4 김건동, 윤주현, "사용자유형에 따른 스마트폰 OS 아이콘의 의미와 표현 측면의 단순화 선호도," 기초조형학연구, 제16권, 제3호, pp.43-56, 2015.
5 Nicholas Gessler, "Skeuomorphs and cultural algorithms," Lecture Notes in Computer Science, Vol.1447, 1998.
6 박옥미, "패션텍스타일디자인에 나타난 스큐어모피즘 현상에 관한 기술의 인문학적 해석," 한국디자인문화학회지, 제24권, 제2호, pp.269-283, 2018.
7 https://story.pxd.co.kr/591, 2020.09.28.
8 https://www.wired.com/2010/07/ibooks-updated-with-image-zoom-audio-and-video-support/, 2020.09.25.
9 오인균, 정석길, "애플 어플리케이션 UI 디자인에 적용된 스큐어모피즘(skeuomorphism) 표현 특성 연구," 디지털디자인학연구, 제13권, 제2호, pp.463-472, 2013.   DOI
10 김보연, 한석환, "iOS 사용자 인터페이스 디자인의 스큐어모피즘 - 시뮬라크르 연속 단계 이론을 통한 해석 -," 커뮤니케이션 디자인학연구, 제67권, pp.198-208, 2019.
11 정동훈, "모바일 플랫폼의 미학적 특징과 UX 평가," 감성과학, 제18권, 제3호, pp.71-80, 2015.   DOI
12 https://www.chicagototal.com/world-news/windows-10-app-icon-renewal/, 2020.09.28.
13 https://terms.naver.com/entry.nhn?docId=3377369&cid=42346&categoryId=42346, 2020.09.28.
14 https://www.hancom.com/board/hshowView.do?board_seq=20&artcl_seq=4593&pageInfo.page=&artcl_clss=&search_text=, 2020.09.25.
15 http://www.elischiff.com/blog/2016/5/24/instagrams-abomination-part-ii, 2020.09.25.
16 http://digxtal.com/insight/20120925/%ec%95%a0%ed%94%8c%ec%9d%98-%ec%8a%a4%ed%81%90%ec%96%b4%eb%aa%a8%ed%94%bc%ec%a6%98%ea%b3%bc-%ea%b8%b0%ec%88%a0%ec%9d%98-%ec%9d%b8%eb%ac%b8%ed%95%99/, 2020.09.24.
17 http://layervault.tumblr.com/post/32267022219/flat-interface-design, 2020.09.28.
18 황순재, "플랫 인터페이스 디자인의 탈 메타포적 관점에 관한 비평적 연구 - 모바일 환경을 중심으로 -," 일러스트레이션 포럼, 제41권, pp.57-68, 2014.
19 김영민, "플랫디자인 적용에 따른 웹사이트 감성 효과 연구," 산업기술연구논문지, 제20권, 제3호, pp.55-66, 2015.
20 https://tipsmake.com/microsoft-explains-the-meaning-of-the-fluent-design-logo-templates-that-are-about-to-be-used-on-windows-10, 2020.09.25.
21 이현주, 홍미희, "국내 웹 디자인 변천사 - 디자인 표현기법과 기술적 변화를 중심으로 -," 한국콘텐츠학회 논문지, 제20권, 제3호, pp.200-208, 2020.
22 경림정, 이진호, "우유 패키지 디자인의 플랫화 사례 연구," 한국디자인학회 학술발표대회 논문집, pp.174-175, 2015.
23 https://biz.chosun.com/site/data/html_dir/2015/09/02/2015090202291.html, 2020.09.25.
24 https://developer.apple.com/design/human-interface-guidelines/ios/visual-design/dark-mode/, 2020.09.28.
25 https://www.ilounge.com/news/ios-13-rumoured-to-introduce-dark-mode, 2020.09.25.
26 https://www.inputmag.com/design/apple-macos-big-sur-the-rise-of-neumorphism, 2020.09.28.
27 박찬익, "인터페이스 디자인의 시각적 무게," 디지털융복합연구, 제17권, 제12호, pp.461-466, 2019.   DOI
28 https://blogs.microsoft.com/blog/2012/02/29/the-midweek-download-feb-29th-edition-microsoft-unveils-the-windows-8-consumer-preview-craig-mundie-hosts-techforum-2012-plus-microsoft-research-visual-studio-11-beta-windows-phone/, 2020.09.25.
29 https://www.uistore.design/items/neumorphic-ui-elements-for-sketch/, 2020.09.10.
30 https://dribbble.com/shots/7994421-Skeuomorph-Mobile-Banking, 2020.09.28.
31 https://builtin.com/design-ux/neumorphismaccessibility, 2020.09.28.
32 https://medium.com/@lukasckuehne/trying-out-soft-ui-12153537dc50, 2020.09.28.
33 https://stoneitgt.com/2020/02/11/neumorphism/, 2020.09.28.
34 https://material.io/design/environment/lightshadows.html#shadows, 2020.09.28.
35 https://material.io/design/environment/surfaces.html#properties, 2020.09.28.
36 https://uxdesign.cc/neumorphism-in-adobexd-8f5347d84737, 2020.09.28.
37 https://uxdesign.cc/neumorphism-in-user-interfaces-b47cef3bf3a6, 2020.09.28.
38 https://www.w3.org/WAI/standards-guidelines/wcag/, 2020.09.28.
39 https://www.wolyo.co.kr/news/articleView.html?idxno=108462, 2020.09.28.
40 https://www.theverge.com/2015/9/1/9239769/new-google-logo-announced, 2020.09.25.
41 https://www.etnews.com/20200220000218, 2020.09.25.
42 김두한, 어도비 XD CC 2020 무작정 따라하기, 길벗, 2020.
43 Katie Lucaites, Brian Fletcher, and Alexander Pyle, "Measuring the Impact of Affordance-Based Clickability Cues," In Proceedings of ACM Conference, Washington, DC, USA, p.7, 2017.
44 https://terms.naver.com/entry.nhn?docId=1588590&cid=50333&categoryId=50333, 2020.09.28.
45 https://cm.asiae.co.kr/article/2015110307273609097, 2020.09.28.
46 김수희, 오치규, "스마트 폰 UI의 디자인 철학에 따른 잠재적 사용자 확보," 한국콘텐츠학회논문지, 제16권, 제10호, pp.503-513, 2016.   DOI
47 김건웅, 고장혁, 정혜경, "머티리얼 디자인을 적용한 북크로싱 서비스," Journal of Integrated Design Research, 제15권, 제1호, pp.21-30, 2016.   DOI
48 강효진, 김승인, "Floating Action Button의 사용실태와 올바른 사용법," 디지털융복합연구, 제17권, 제4호, pp.261-266, 2019.   DOI
49 https://www.tested.com/tech/android/466219-everything-you-need-know-about-android-50-lollipop/, 2020.09.25.
50 김병주, "모바일 GUI에 나타난 디자인 표현 특성에 관한 연구," 디지털디자인학연구, 제14권, 제4호, pp.295-306, 2014.
51 http://www.itworld.co.kr/t/54653/%ED%81%B4%EB%9D%BC%EC%9A%B0%EB%93%9C%20%EC%98%A4%ED%94%BC%EC%8A%A4/129734, 2020.09.25.
52 https://chrome.google.com/webstore/detail/floating-action-button-fo/gcmplbpmeilihjhdolgikjoohcffdhio?hl=ko, 2020.09.25.
53 https://dottotech.com/create-gorgeous-forms-with-google-forms/, 2020.09.25.
54 https://www.apple.com/kr/newsroom/2019/06/apple-previews-ios-13/, 2020.09.25.