MONITORING SYSTEM INTERFACE DESIGN BASED ON TYPOLOGY
DOI:
https://doi.org/10.32782/2415-8151.2024.34.51Keywords:
monitoring system, graphic design, icon, color, style, layout, interface design, typology, design trends, human-computer interaction.Abstract
Abstract. This article analyzes the main concepts and the process of typology development, and also explores the application of typology in the field of interface design. Purpose. The aim of the study is to systematize the elements of monitoring system interfaces, such as icons and color characteristics, types of interface design, and to provide recommendations for further optimization of monitoring system interface design. Methodology. The study involved a literature review to examine the principles of monitoring system interface design. Additionally, a systematic analysis of 70 samples of monitoring system interfaces was conducted. The analysis covered the study of icon types, element placement on the screen, and the color schemes used in these interfaces. Results. The study generalized the types of monitoring system interface icons and characterized 10 common interface design styles, including linear rectangular, rounded corner linear, open, multicolor, gradient, overlay, linear surface, flat, skeuomorphic, and light skeuomorphic styles. It was found that the style of monitoring system icons evolves with system version updates and exhibits certain characteristics of continuity. From the analysis of monitoring interface layout design, 9 interface design styles with different layouts were summarized, which combine with types of Chinese characters for image processing, making the style more recognizable. A total of 90 HSB interface colors were identified. It was found that the most widely used and high-frequency HSB color range is 180° < H ≤ 240°, 0% ≤ S ≤ 20%, and 20% < B ≤ 40%, represented by dark blue. This interface color range can provide a theoretical foundation and support for design optimization for developers working with monitoring interfaces. Scientific novelty. For the first time, icon types and optimal color solutions for monitoring system interfaces were identified. The principles of interface design were further developed. Practical significance. Through the analysis of monitoring system examples, interface design elements such as icons, layout, general design style types, and high-frequency monitor color features were developed to provide informational support for the design of monitoring system interfaces.
References
Cao J. 曹建军.试论高等院校安全技术防范系统的建 设[C]//北京高教保卫学会.«完善安全防控体系 构建和谐校园»学 术研讨会文集.南开大学. 2005.
Fang X. 方学兵. 人机界面信息视觉化设计研究硕 士(学位论文,合肥工业大学). 2010. URL: https://kns.cnki. net/kcms2/article/abstract?v=dmo7fjsfblgngyrfnqhr-- 33zgpsw2mqtnrc8gfu1xehvff3t-e1tmywq00zcwsykieg58l bujb7lzsnyeo_qfx7e-7mckg43wt6psr_9bi1uwceutr2v_2q kkcn26nbzvcpalrwtxhy1qqjloa92qgefn7s94wj-5mewh7_ yfhsvwotqieqw92glyjmc-in&uniplatform=nzkpt&languag e=chs [in Chinese].
Hong N.洪纳娜.().基于类型学理论的信息视觉设计 研究.上海包装. 2013. № (08). p. 15–18. doi:10.19446/ j.cnki.1005-9423.2013.08.005. [in Chinese].
Huo F. 霍发仁.人机界面设计研究(硕士学位论文,武 汉理工大学).硕士. 2003. URL: https://kns.cnki.net/kcms2/ article/abstract?v=xpm8-w1vms8nezxkexo8s1tokr4se y c m l o 5 g o d l n w m g e k 4 t n h c b l j d o v g - o j f g k y c v 3 w v f u g s t 4 2 i 1 w v p g a p z h 0 x g k g c j b h i j 3 1 m n f j p _ ycpzknnzc6p9bkkuzccvok03l6akoexjuwlisa3bwu_ xaj3deuocqlebw2etqptkwotuqp_-znrqqlk4ymb9bv&unipl atform=nzkpt&language=chs [in Chinese].
Jin L. 金龙强. «表象形式»下的«类型过程»博士(学 位论文,中国美术学院): Doctoral thesis, China Academy of Art. 2022. URL: https://doi.org//doi/10.27626/d.cnki. gzmsc.2022.000058. [in Chinese].
Jing N., Fang H., Zhang Q. 景楠,方海 张秦玮. 基于类型学的产品风格创新设计研究.机械设计. Mechanical Design. 2015. № 04. С. 121–125. https://doi.org/ doi:10.13841/j.cnki.jxsj. [in Chinese].
Jørgensen A. H., Myers B. A. User Interface History. In Proceedings of CHI 2008: Extended abstracts on Human factors in computer systems. Association for Computing Machinery. 2008. p. 2415–2418.
Li Z.李智美. 基于原型类型学的汽车前脸风 格创新设计方法研究硕士(学位论文,贵州大学): Master’s thesis, Guizhou University. 2022. URL: https://doi.org/ 10.27047/d.cnki.ggudu.2022.000901. [in Chinese].
Lu Y., Zheng H., Chand S., Xia W., Liu Z., Xu X., Wang L., Qin Z., Bao J. Outlook on human-centric manufacturing towards Industry 5.0. Journal of Manufacturing Systems. 2022. № 62. p. 612–627. https://doi.org/10.1016/j.jmsy.2022.02.001.
Luo W. 罗文亮. 智慧校园安防系统的设计与 实现(硕士学位论文,大连海事大学).硕士Dalian Maritime University. 2016. URL: https://kns.cnki.net/kcms2/ a r t i c l e / a b s t r a c t ? v = x p m 8 - w 1 v m s 9 e 3 h 3 e x t v b _ b g 6 m 9 x w v i t h k 3 b va z 0 m h 7 m e i g w 4 w 2 w j b d g s q e _ e e j 2 a g c y x j 9 l y 4 a j q g 8 r e u g y h n j j o t r z j w h 0 z c _ u q q q h y s h t n 0 b e x r h g f a y g k x r y 7 a l i j w r f a t 3 z 2 _ 9 3 y y y y s z 2 1 v y f k k x i f m 6 v k 1 w s p g j u x 4 a j - wljf8k9lb7dgwnvq0r_osei_zb5to-5y=&uniplatform= nzkpt&language=chs [in Chinese].
Paterlini M. There shall be order. The legacy of Linnaeus in the age of molecular biology. EMBO reports. 2007. Vol. 8, № 9. p. 814–816. https://doi.org/10.1038/ sj.embor.7401061.
Wang J. 王佳.().UI设计理念的接受美学阐 释(硕士学位论文,浙江工业大学).硕士 [ Master’s thesis]. Zhejiang University of Technology, 2015. URL: https:// kns.cnki.net/kcms2/article/abstract?v=xpm8-w1vmsxuuvutgtrh6drcjz6mv8utwq17jsdh6661gy7cigbuar trnxgowlds7-cehcdetsrqy6yacqmdkdgefjcuebk2rnb o q e i u i v o q f 1 z x u o v r t 1 l 5 v r w a c v y - r 4 t s i v 4 1 a m e b b r 9 d p l g w k 0 d _ j o - c f t l b n l 3 n d v q q p h y d q 3 w 3 f w f f c _ u 4 u l g j c m y n 8 l m z _ 7 j y i = & u n i p l a t f o r m = nzkpt&language=chs [in Chinese].
Wang L. 汪丽君.广义建筑类型学研究博士(学位论 文,天津大学) Tianjin University, 2003. URL: https://kns. cnki.net/kcms2/article/abstract?v=dmo7fjsfbleq0kc3q maqfrshyjn5ldrlak5ivjubv2 umphmhegqop1fwtmiuvhak vtuqjchpzalv4jhuzw7 kpyggqts83dsqrudp33oudwv0zgjt0syxf- t1r65parbqwyqmj1fcroyl6lotnw1jjeq_ 2fwqvthui5fazvuee9rptni9fca7 orifagxlxtx&uniplatform= nzkpt&language=chs. [in Chinese].
Xu X. 徐旭志.我国安防视频监控系统的发展历 程分析及5G趋势展. Electromechanical Information. 2020. № 03. p. 97–98. https://doi.org/doi:10.19514/j.cnki. cn32-1628/tm.2020.03.053. [in Chinese].
Yuan X., K.H.NG K., Li Q., Yiu C. Y., Lau C. K., Fung K. H., NG L. H. Exploring the Human-Centric Interaction Paradigm: Augmented Reality-Assisted Head- Up Display Design for Collaborative Human-Machine Interface in Cockpit. Advanced Engineering Informatics. 2024. № 62. https://doi.org/10.1016/j.aei.2024.102656. [16] Zhan C. 湛晨. GUI设计中情感与体验研究 (硕士学位论文,中南民族大学).硕. 2015. URL: https:// k n s . c n k i . n e t / k c m s 2 / a r t i c l e / a b s t ra c t ? v = x p m 8 - w1vms-hd65bb8lnf5sistl7ls6svkhx- tmpt7iaihwhg l 8 y s z v 8 r y 2 f k j s k z t d j c j 6 e 6 o 8 u a j n 6 a n u d 5 x _ r y r j 5 r w q d x s 2 o g x u i 0 f t h 2 v e p t 9 b y s t o v x c j g h q x 8 h j e p t f y w m 1 t n c v b e s i x e r q x q z o c s t k v o 4 i g s 8 e c 8 d 8 9 q s l d k 2 p d n h w x d x u j w c _ i0mpw2kk4j58=&uniplatform= nzkpt&language=chs [in Chinese].
Zhang C., Wang Z., Zhou G., Chang F., Ma D., Jing Y., Cheng W., Ding K., Zhao D. Towards newgeneration human-centric smart manufacturing in Industry 5.0: A systematic review. Advanced Engineering Informatics. 2023. № 57. https://doi.org/10.1016/ j.aei.2023.102121. [18] Zhang H., Xu J. 张寒凝 许继峰.论类型学方法在 新中式家具设计中的运用.包装工程. Packaging Engineering. 2009. № 08. С. 106–108. https://doi.org/doi:10.19554/ j.cnki.1001-3563.2009.08.038. [in Chinese].
Zhang L. 张璐.解析帕拉第奥的建筑世界硕士(学 位论文,南京大学) : Master’s thesis, Nanjing University. 2011. URL: https://kns.cnki.net/kcms2/article/abstract?v= dmo7fjsfblgsgyoxw- clnzsdigid7pcld5mchntbyzg0wnke2 s z v x 4 j x o 1 w v 7 7 n t n l o p s o n z 4 v _ q s z d 6 v - i c l 5 a z l y o o o 0 z w z z h a 9 r k b x u l p 1 c _ t b e - r e e l s x c 0 o 2 w 4 g k y t o p l r t g - w k p k - x l n y k r e k i 0 0 r x m o g k 9 a h i r f 4 k c _ 6 2 p t i 0 m b 9 t t w l 7 y d c q 5 0 e m & uniplatform=nzkpt&language=chs. [in Chinese].
Zhou T., Yezhova O. Contemporary research trends in human-computer interface design. Art and Design. 2024. Vol. 26, № 2, p. 90–101. https://doi.org/ doi:10.30857/2617-0272.2024.2.9.
