모바일 UX 관점에 따른 프로그레시브 웹앱의 GUI 디자인 연구

김병주 한국전시산업융합연구원 2017 한국과학예술융합학회 Vol.29 No.-

For the mobile website, once it is implemented in a standard language, e.g., HTML, it works for diverse operation systems of mobile devices. It cannot, however, work faster than the mobile app. On the other hand, even though the mobile app works even faster than the mobile websites and provides various graphical interface, each different version should be implemented for different OSs of the mobile device. To overcome those issues for each, so call 'progressive app' has been designed by Google corporation, by combining functional benefits of the mobile website and the mobile app. The progressive app facilitates usage in different operation systems of mobile devices, high loading speed, and fancy graphic-performance, from each advantage of mobile website and app. The progressive app does not, however, have ability to sufficiently provide user-experience (UX), since their engineering technologies have been heavily improved only, exclusive of the enhancement of the GUI-design. The aim of this work is to propose an efficient graphic-user-interface (GUI) design method for the progressive web app, so as to sufficiently provide the UX. In this work, the pilot experiments have been conducted to product the checklist for the mobile UX design, based on the factors of the UX proposed by Bernd Schmitt. Using this, we have surveyed for the satisfaction for the UX of different mobile contents (e.g., mobile web, mobile app, and progressive web app), targeting people in their 20s. As a result, the satisfaction with the UX for the progressive web app was higher than that of the mobile web, but lower than that of mobile app. It has been concluded that overall design method, by analyzing the GUI design factors (e.g., color, touch, sound, navigation, image, icon, animation, button, and more) corresponding to 'sensing', 'sensitive', and 'behavioral' user-experience, so that the UX design of the progressive web app can be enhanced. Therefore, it should be expected that the design methodology proposed by this work will provide the guideline for the mobile UX-design of future progressive app. 모바일 웹은 제작된 하나의 소스로 모든 플랫폼에서 사용가능하지만, 실행속도가 느린 단점이 있는 반면, 모바일 앱은 로딩속도는 빠르고 다양한 형태의 인터페이스 구현이 가능하지만, 각 플랫폼에 맞는 언어로 여러 개의 콘텐츠를 제작해야만 한다. 이러한 단점들을 보완하기 위해, 최근 구글 사에서는 모바일 웹과모바일 앱의 장점들을 융합하여 새로운 모바일 형태의 프로그레시브 웹앱을 개발하였다. 프로그레시브 웹앱은 모바일 웹과 모바일 앱의 장점을 융합하여 하나의 소소로 다양한 플랫폼에 적용 할 수 있으며 빠른로딩속도와 화려한 퍼포먼스 등이 가능해졌다. 하지만프로그레시브 웹앱은 공학적인 기술향상에만 초점을맞추어 개발되었기 때문에, 이러한 환경이 충분히 활용 될 수 있는 효과적인 디자인 가이드가 존재하지않고, 이로 인해 사용자 경험을 충분히 제공하지 못하고 있다. 본 논문에서는 프로그레시브 웹앱을 대상으로 사용자 경험을 충족할 수 있는 효과적인 GUI 디자인을 연구하여 제시하는 것을 목적으로 두고 있다. 이를 위하여 번트 슈미트의 경험 디자인 요소에 근거한 예비 실험을 진행하여 ‘모바일 UX 디자인 평가 요소’를 도출하였고 이를 토대로 설문을 작성하고, 모바일 사용에 친숙한 20대 모집단을 선정하여 각기 다른모바일 콘텐츠(모바일 웹, 모바일 앱, 프로그레시브웹앱)를 대상으로 사용자 경험의 만족도 조사를 실시하였다. 실험결과, 프로그레시브 웹앱의 사용자 경험만족도는 모바일 웹 보다는 높은 반면 모바일 앱에비하여 낮은 것으로 분석 되었으며 프로그레시브 웹앱의 UX 디자인 향상을 위해서는 ‘감각’, ‘감성’, ‘행동’ 적 사용자 경험에 해당하는 GUI 디자인 요소(컬러, 터치, 사운드, 네비게이션, 이미지, 아이콘, 애니메이션, 버튼 등)들의 상호 관계성을 파악하여 전반적인디자인이 제시되어야 한다는 결론을 얻었다. 따라서본 연구에서 제시한 디자인 방법론이 향후 프로그레시브 웹앱의 모바일 UX 디자인 연구에 있어서 효과적인 지침을 제시할 것을 기대한다.

UX 디자인 방법론을 활용한 앱 서비스 디자인 사례 연구 - 주차정보 앱을 중심으로 -

윤정식,이예진,정광태 한국엔터프라이즈아키텍처학회 2024 정보기술아키텍처연구 Vol.21 No.3

본 연구의 목적은 주차정보 서비스 앱을 중심으로 UX 디자인 방법론을 활용한 앱 디자인 방법을 제시하는 것이다. 자동차는 가장 대중화된 모빌리티 제품으로, 주차공간의 부족으로 인하여 많은운전자들이 주차정보 서비스 앱을 활용하여 필요한 주차정보를 얻고 있다. 사용자를 총족하는 스마트폰 앱을 디자인하기 위해서는 다양한 사용자의 경험을 체계적으로 고려하는 것이 중요하다. 이를 위해 앱 디자인 과정에서 UX 방법론을 체계적으로 적용하였다. 사용자의 요구사항들을 발견하기 위하여 사용자분석, 태스크분석, 컨텍스트분석, 기술분석이 진행되었다. 그리고 분석된 결과를 반영하여 컨셉디자인, 스트럭쳐 디자인, 인터랙션 디자인, 인터페이스 디자인 작업이 수행되었다. 마지막으로 디자인된 앱의 사용자경험을 평가하기 위하여 프로토타입을 개발하였고, SUS 방법, magnitude estimation 방법, 그리고 다기준 사용자경험 평가 방법을 활용하여 기존의 주차정보 서비스앱과의 사용성과 만족도, 그리고 사용자경험을 비교평가하였다. 평가 결과, 본 연구에서 디자인된 주차정보서비스 앱이 기존 앱과 비교하여 더 높은 사용성과 만족도, 그리고 사용자경험을 제공하고 있는 것이 확인되었다. 향후 본 연구의 결과는 다양한 앱의 디자인을 위한 방법론으로 활용될 수 있다. This study was carried out to propose app design methods and examples using UX design methodology, focusing on parking information service apps. Car is the most popular mobility product, but due to a lack of parking spaces, many drivers are using parking information service apps to obtain necessary parking information. It is important to satisfy the user experience of various users. To this end, UX methodology was systematically applied in the app design process. User analysis, task analysis, context analysis, and technology analysis were conducted to discover user requirements. And concept design, structure design, interaction design, and interface design were performed by reflecting the analyzed results. Finally, a prototype was developed to evaluate the user experience of the designed app, and the usability and satisfaction with the existing parking information service app were compared and evaluated using the SUS method, magnitude estimation method, and multi-criteria UX evaluation method. The result revealed that the parking information service app designed in this study provides higher usability, satisfaction, and UX compared to existing apps. This study can be used as a methodology for designing various apps in the future.

APP 인터페이스의 시각적 배리어프리 디자인 연구

손만연,곽대영 차세대컨버전스정보서비스학회 2023 차세대컨버전스정보서비스기술논문지 Vol.12 No.4

With the advent of various APP products, the function-oriented product demand is gradually developing to the personalization-oriented product demand. Up to this day, although some product manufacturers have made some barrier-free design for hardware, there are still deficiencies in visual barrier-free design in some APP interfaces. An important idea in product design is ‘people-oriented’, which considers not only the use situation of normal people, but also the demands of special groups. Therefore, this topic takes the visually impaired group as the research object, uses the visual barrier-free design to organize some design concepts applicable to the majority of the visually impaired group, and calls on interface designers to consider more about some special groups when designing. This topic focuses on the theoretical research, with aid of applied research. This paper is mainly divided into four parts, of which the first part is the background of the visually impaired group; the second part clarifies the user portrait of the visually impaired people, understands their needs, and proposes the visually impaired people; the third part conducts analysis and demonstration from the aspects of visual barrier-free design theory and practice; and the fourth part conducts case analysis on APP involving visual barrier-free design today. In this paper, the most basic purpose of the design and research of the visually impaired people is to solve the problem of diversified demands caused by the difference of visual impairment from the perspective of humanistic care. 다양한 APP의 등장과 더불어 기능을 중시하던 패턴이 개인화 중심으로 발전하였다. 일부 제조업체는 하드웨어 배리어 프리 디자인을 제작하였으나 APP 인터페이스의 시각적 배리어 프리 디자인은 여전히 부족한 실정이다. 제품의 디자인에 있어 가장 중요한 것은 일반인뿐만 아니라 특수 집단의 요구를 고려하는 것이다. 이에 따라 본 논문은 시각 장애 사용자를 연구 대상으로 하며, 실명한 사용자는 포함하지 않는다. 시각장애인들에게 적용할 수 있는 시각적 배리어-프리 디자인을 정리하고, 인터페이스 디자이너의 일부 특수 집단을 고려한 디자인을 제시했다. 연구는 크게 네 가지 부분으로 분류했다. 첫째는 시각 장애인들의 배경 이해이다. 둘째는 시각적 장벽을 없애는 디자인 이론과 실제 분석이다. 셋째는 오늘날 시각적 장벽을 없애는 APP 연구 사례를 제시하였다. 넷째는 결론과 연구의 한계점이다. 본 논문에서는 시각장애인들이 겪는 다양한 문제를 인본주의적 돌봄의 관점에서 해결하는 데 목적을 두고 있다.

勸導技術与小學生教育類App的融合設計硏究

주경상(Zhu, Qingxiang),이진욱(Lee, Jin Wook) 한국전시산업융합연구원 2020 한국과학예술융합학회 Vol.38 No.2

Educational Apps have been widely used by elementary school students, but the design of them needs to be improved. The purpose of this paper is to study the convergence design of persuasive technology and elementary school students" educational App. Through the persuasive design, to alleviate the elementary school students" weariness, improve their learning enthusiasm and initiative. Firstly, the learning behavior of elementary school students is studied by means of participatory observation, and it is concluded that the learning behavior can be divided into four stages: the stage of learning intention, the stage of learning preparation, the stage of learning execution, and the stage of learning completion. On this basis, the factors affecting the weariness of elementary school students at each stage were obtained by means of participatory observation and interview. Then, by analyzing the influence factors of weariness in each stage, persuasive strategies are proposed from the three dimensions of motivation, ability and trigger, and the persuasive design strategies of elementary school students" educational Apps are summarized. Finally, the results of this study were applied in an App design project, and the effectiveness of these strategies was verified by a controlled experiment, which can help primary school students to improve their enthusiasm and initiative in learning and can effectively reduce the weariness of elementary school students. The results of this study can provide reference for the persuasive design of elementary school students" educational Apps.

디자이너의 인지심리 기반 창의성 유형에 따른 앱 UX/UI 디자인 분석

위장훈(Wi, Jang Hoon),윤여경(Yoon, Yeo Kyung) 한국전시산업융합연구원 2018 한국과학예술융합학회 Vol.35 No.-

본 연구의 배경은 다음과 같다. 새로운 것을 항상 만들어 내는 디자이너에게 항상 부족하다고 생각되는 부분이 바로 창의적 사고이다. 하지만 창의적 사고가 크게 발현되어야 할 분야인 디자인 교육현장에서도 창의성 계발에 관한 교육 프로그램 개발이나 활용이 활발하게 이루어지지 않고 있다. 4차 산업혁명의 시대 슬로건을 내민 현재, 소프트웨어 교육이 화두가 되고 있다. 또한, 시각정보 디자인 교육에서도 앱 개발에 필요한 기본적 지식을 요구하고 있다. 따라서 본 연구의 목적은 APP UX/UI 디자인 교육현장에서 컨셉단계(UX), 표현단계(UI)에 있어 디자인 전공자들의 창의성에 대해 알아보고자 전공 대학생들의 아이디어 발상에 대한 실험과 그들의 창의 척도를 분류하여 창의성 유형과의 상관성을 분석하여 창의적사고를 함양할 수 있는지에 대한 가능성을 알아보고자 하였다. 이를 위해 2개 대학 디자인 전공자를 대상으로 APP UX/UI 디자인 실험을 진행하였으며, F.G.I를 통해 크게 A, B, C 3가지 유형으로 분류되는 것을 알 수 있었다. 그 후 KAI 척도를 사용하여 실험 대상자들의 창의성 유형을 인지적응자와 인지혁신자로 분류할 수 있었다. 또한, KAI 척도에 분류된 디자인유형을 비교 분석하여 3가지 창의성 유형에 대한 특징을 기술할 수 있었다. 본 연구를 통해 APP 디자인 교육에 있어서 디자인 창의성 유형 연구에 대한 검토를 시사할 수 있었으며, 향후 심리과학 등과의 융합적 접근으로 다양한 분야에서의 창의성 연구에 대한 중요성을 제언하였다. The background of this study is as follows: It is creative thinking that there is always a shortage for designers who make new things. However, there is no active development or use of an educational program on creativity development in design education, an area where creative thinking should be developed. With the slogan of the era of the fourth industrial revolution, software education has become a hot topic. It also requires basic knowledge that is required to develop apps in education on visual information design. Therefore, the purpose of this study was to analyze the concept phase (UX) and the presentation stage (UI) of the design majors` creativity in the field of APP UX/UI design education by classifying their creative modalities with experimental techniques. For this purpose, we conducted APP UX/UI design experiments with design engineers at two universities and found that F.G.I was largely classified into three types: A, B and C. The KAI scale was then used to classify the types of creativity of the subjects as cognitive adaptors and cognitive innovators. It was also possible to compare and analyze design types classified on the KAI scale to characterize the three types of creativity. Conclusion, This study could suggest a review of the type of design creativity study in the APP design training and suggested the importance of creativity research in various fields through a convergence approach with psychology, science, etc.

Kano Model Analysis Required in APP Interactive Design based on Mobile User Experience

Xiaofei Li,Yue You 보안공학연구지원센터 2016 International Journal of Multimedia and Ubiquitous Vol.11 No.11

The user experience in APP interactive designdraws more and more attention in the APP market where the user population expands continuously and the competition becomes increasingly intense, butcurrent studies mostly focus on the user website experience. This paper is intended to classify and study user needs in APP interactive design based on Kano model and Better-Worse coefficient, and gain Kano two-dimensional attribute classification of user needsin the design. In addition, it carries out analysis on these needs based on the better-worse coefficient.

운동 앱의 지속적인 사용을 위한 설득형 디자인 연구 -중국 사례를 중심으로-

주옌치 ( Zhu Yanqi ),이창욱 ( Lee¸ Chang-wook ) 커뮤니케이션디자인학회 2021 커뮤니케이션 디자인학연구 Vol.77 No.-

With the improvement of China's economic level and the continuous development of the national economy, people are paying more and more attention to their own health problems. Although people have health awareness, the actual amount of exercise is still insufficient. Persuasive design, as a design theory that influences and changes user behaviors and attitudes, has been continuously developed and applied in many fields, and it plays an important role in guiding user behavior. This study derived three factors (satisfaction, usefulness, and ease) that influence users' continuous use of exercise apps through previous studies. Cases of Chinese exercise apps were analyzed by combining continuous use factors with components of persuasive design (motivation, ability, and trigger). The conclusion is eight design proposals for fitness apps based on continuous use factors and persuasive design components. In addition, the persuasive design analyzed cases of Chinese fitness apps according to three persuasion factors, motivation, ability, and trigger, and presented specific persuasion strategies in fitness apps such as goal setting, irregular compensation, and gamification exercise methods. Research was conducted to help design and optimize the use of fitness apps in the future, and induce active exercise behavior and use of fitness apps. Provide suggestions for the design and optimization of fitness apps in the future, so that users can continue to use them to achieve the purpose of guiding people to develop and maintain fitness behaviors.

공간 설계지원 및 시각화 웹 앱 분석과 지능형 기술 활용성 고찰

조하영 ( Jo Hayoung ),이진국 ( Lee Jin-kook ) 한국공간디자인학회 2022 한국공간디자인학회논문집 Vol.17 No.7

(Background and Purpose) This study examines the space design-supportive platforms on top of a web/app-based environment that introduces and utilizes the latest so-called artificial intelligence (AI) assisted technologies and analyzes the application and expansion potential of such technologies in the field of architecture and space design. Due to the development of hardware and the spread of cloud computing, people are using various smart devices such as mobiles, tablets, desktop PCs, and platforms such as specific webs and apps that require high utilization beyond the device or computing environment; these adaptive web/apps are actually being activated. It has been expanding into areas that are easy to access, such as entertainment, as well as areas that require professionalism and productivity, so that not only experts but also ordinary people can easily access the area of space design and visualization by using various smart devices. Additionally, due to the coronavirus pandemic in recent years, interest in space design has increased due to social distancing and contact-free activities, and space design support tools have emerged more actively. Intelligent technology, a keyword that has been steadily mentioned in relation to the era of Industry 4.0, is promoted on these platforms, and the number of users of these platforms is increasing. (Method) In support of this technical environment, this study investigates and analyzes space design-supportive web/app-based tools that introduce and utilize intelligent technology, further evaluating and partially quantifying the functionality and utilization of intelligent technology. Therefore, this study selects and investigates 11 web/apps for space design-supportive tools and analyzes them according to the following three perspectives: 1) applicability of intelligent technology, 2) interoperability of platforms, and 3) ability to support the function of XR and visualization. This study aims to set the relevant analysis items and detailed analysis items to conduct a quantitative evaluation and to examine the platform evaluated above more closely through scoring. (Results) Thus, as a result of evaluating 11 types of spatial design-supportive platforms selected in this study according to 10 detailed items, it was confirmed that other than some platforms have not yet actually provided services based on high-level intelligent technology. Additionally, platforms that focus on visual parts, such as responsive UI design of web/app platforms or intuitive visualization areas, such as XR utilization, can be found to have significantly high growth potential. (Conclusions) The results of this study can be used to review the utilization and limitations of intelligent technology-based functions currently used in space design-supportive platforms, which can contribute to the development of various intelligent learning models and platforms that support easy and automated functions and services in space design.

한·중 애완동물 커뮤니티 앱의 UI 디자인에 대한 비교 연구 - 페팸, 포인핸드, 리펫, 빕테일을 중심으로 -

왕정 ( Wang Jing ),박진숙 ( Park Jin Sook ) 디자인융복합학회 2017 디자인융복합연구 Vol.16 No.5

In order to relieve the social stress and loneliness which comesfrom the society's rapid change, people are increasing their attention towards pets. This kind of phenomenon became an opportunity to extend to the social market which offers all kinds of products and services for pet owners. With the spread of smart phones and Apps with mobile community functions, we have seen varies services appear which revolve around pets. This study is to develop and improve UI(user interface) design of Korean and Chinese Apps by analysing 'Pefam' , 'Paw in Hand' in Korea, and 'Leepet' , 'Viptail' in China. After reviewing previous research and investigating UI design element structure and standards, I extracted detailed evaluation items of pet community Apps. To evaluate each APP’s function and interface design, Korean and Chinese students responded to the survey for comparing the three kind of functions. As a result of the research, I not only found the advantages and disadvantages in each App, but also found a way to improve the development of pet community App so that Korean and Chinese Apps may benefit. Moreover, I executed the objectivity of the logical evaluation process of pet community Apps’ UI design. I hope this result of research not only can be applied to pet community App's UI design, but also can be used for UI design of related Apps.

상황인식 개념을 활용한 중국 소방앱 설계전략에 관한 연구 - 소방앱 사용과정에 따른 사용자 니즈 분석을 중심으로 -

관개원,주 초,김민수,박경진 한국전시산업융합연구원 2023 한국과학예술융합학회 Vol.41 No.4

Mobile firefighting apps are receiving a lot of attention for efficient deployment of local firefighting resources and dissemination of various firefighting knowledge information. However, currently, in the case of Chinese fire-fighting apps, the functions/services on the interface required depending on the situation in which the user uses the app are insufficient to meet the user's needs. Accordingly, this study attempted to present a design improvement strategy to improve the user experience of using a fire-fighting app by analyzing the user needs of a Chinese fire-fighting app based on the concept of situation recognition. This study conducted a semi-structured interview and affinity method for 17 Chinese fire app users to organize user needs for the app's function/service, and developed a design prototype of the fire app through the Ahp comparison matrix analysis method to test. The study found that when using a fire app, it can generally improve consumers' satisfaction with fire-fighting app usage by meeting fire-fighting knowledge, purchasing fire-fighting products, booking fire-fighting training, and other functional requirements. The results of this study will be helpful in proposing a strategic design plan considering the function/service of the Chinese fire app interface that can cope with future fires and usage situations.