A Research of User Interface Design Elements on Smart TV

Transcription

1 A Research of User Interface Design Elements on Smart TV 저자 (Authors) Byungmi Choi, Yoojin Lee, Sam Seungho Park 출처 (Source) 아시아디지털아트앤디자인학회학술대회자료집, , (4 pages) 발행처 (Publisher) 아시아디지털아트앤디자인학회 Asia Digital Art and Design Association URL APA Style Byungmi Choi, Yoojin Lee, Sam Seungho Park (2014). A Research of User Interface Design Elements on Smart TV. 아시아디지털아트앤디자인학회학술대회자료집, 이용정보 (Accessed) 이화여자대학교 /05/02 13:00 (KST) 저작권안내 DBpia 에서제공되는모든저작물의저작권은원저작자에게있으며, 누리미디어는각저작물의내용을보증하거나책임을지지않습니다. 이자료를원저작자와의협의없이무단게재할경우, 저작권법및관련법령에따라민, 형사상의책임을질수있습니다. Copyright Information The copyright of all works provided by DBpia belongs to the original author(s). Nurimedia is not responsible for contents of each work. Nor does it guarantee the contents. You might take civil and criminal liabilities according to copyright and other relevant laws if you publish the contents without consultation with the original author(s).

2 A Research of User Interface Design Elements on Smart TV Byungmi Choi Yoojin Lee Sam Seungho Park Abstract With the development of information and communications, various smart markets around smart phones draw a lot of attention. Following this trend, smart TVs are striving to stand at the center of home appliances as the hub. However, smart TVs are keeping users at distance with diverse functions not considering the users and complicated operation system. Therefore, this study aims to structuralize and categorize diverse elements of user interface of all-in-one, set top box, and dongle types of smart TV products with diverse perspectives, with an expectation to develop user-friendly interface that meets users' expectations. Through literature reviews, smart TV user interface categorized into three phases; structure(structure of the information), representation(interface layout, transition), and interaction(remote controller). Through Samsung and LG's smart TV cases, it aims to make new frames about the expressions of smart TV interface design. Keywords: Smart TV, User Interface Design, Interaction 1 Introduction Development of wireless communications technology which was triggered by popularization of smart phones is allowing the advent of smart home appliances such as smart refrigerators or smart washing machines. Among those appliances, smart TVs indicates TVs, which are physically at the center the house, becoming smart appliances. Smart TVs have been on the market for 5 years. Although their sales are constantly increasing, there are not many users who take advantage of all the functions of smart TVs. This indicates that users are not truly acknowledging the necessity of Smart TVs, and rather think of Smart TVs as large TVs with clearer pictures. In other words, even though consumers do purchase smart TVs, they often fail to understand all its functions. Rather, they use smart TVs simply for watching contents, not using diverse external devices or application. There has been many reports analyzing the cause of passive use of Smart TVs and its failures. Why is smart TVs not being fully used by the users? Firstly, smart TVs are function-centered TVs with the combination of complicated functions, which excludes the smartness the users want. Second, the adoption of interface of smart phones while ignoring the spatial and medium characteristics is another reason. Based on these, I started this writing with this question; What are the components of interface that should be considered for smart TVs? To summarize, this study is aimed at varied considerations of currently developed smart TVs. By structuring and categorizing the user interface of each smart TVs, understanding of the limitations of each products are expected, which could be dedicated to expansion of use of the users. 2 Smart TV User Interface 2.1 The Definition of User Interface Between digital systems and humans, there are normal input devices and output devices. A series of interactions is conducted with these input and output devices. When they interact, the input and output devices which human contacts and the contents expressed through the devices are called 'user interface'. There are various forms of input devices of user interface; buttons, dials, switches, mouse, and touch pads. For output devices, display and speakers are included. The core means of interface of digital devices such as smart phones or computers is an effective communication of the users, which should provide them with high usability and effectiveness so that they may reach their goals quickly and easily. For this goal, holistic components, such as operation system of the interface, layout, style, graphic, and menus should be considered. 2.2 The Details User Interface Design According to Hyekyoung Kim(2012) s research, user interface design can be categorized into 3 elements, structure, representation, and interaction. Elements Representation Category s that dedicate to unity and consistency of representation and interaction in interface designs s that help the recognition and understanding of the users, such as layout, graphic, and transition 219

3 Interaction Interactions of designed interaction models required in interface Table 1. The Detailed Elements of Interface Design Implementation Interface Basically, detailed layout of the information components is decided according to the structure of interface, so understanding of structural characteristic of smart TV environment interface is required, at least to apply change screen transition. The following Table 2 is the structures and types of interfaces and Table 3 is the detailed information elements on Smart TV structure. Sequence - Parallel structure where multiple information are shown at single wide screen - The most simple and familiar system composition - Narrative, chronological, or when there are clear logical orders between the components Grid - Grid structures are used when information is not sequential but independent - Includes information such as geological distribution map, newspaper, photo and images Hierarchy - Systematized hierarchical structure - Most suitable for composing complex information - Collective information of items with more than one parental objective and link, such as family tree Network - Information is randomly connected to other items - May have several upper pages. Complex because it does not have specific structure - Users have difficulty understanding overall structure - Higher interactivity compared to other structures contributed by users' own system research Mixed - Frequently used in recent application services where adoption of diverse contents is required Table 2. Information Information Elements Sequence List Menu Grid Tile Menu Hierarchy Tab Menu, Folder, File Network Idle Menu, Application Mixed Inside of the Application Table 3. Information Elements on Interface Layout Layout may change into diverse forms according to the structure of the information. The following Table 4 is layouts used in smart TVs. Layout Description List Grid Popup Tab Split Over lay Full screen Transition The most commonly used layout. Often shows text based lists by listing. The most frequently used one for image menus. May apply separate animation by grid. Practicing screen pops up covering the existing screen. The most frequently used one in early smart phones applications. Each tabs shows screen and detail information of different menus. While an image is on screen, another image surges from one corner of the screen when menu is clicked. The screen is shown split. Screen is overlapped. In this method, upper image or text is usually clear and previous screen is dark or blur, used as background. Without extra split of screen, showing an image or video fully on screen. Table 4. Layout Phenomena UI Design Lab in Japan categorizes the most basic screen transition effect into six; Overlay, Wipe, Slide, Transformation, Fade, and Dissolve. Ji Yong Kim(2010) categorizes it by twenty, including 3 dimensional effect. Among these effects, the following are divided including effects currently being used in smart TVs. Name Feature Role Slide Moves by X, Y-axis and pushes to previous page Sense of movement on screen and the move of contents Zoom Over lap Cube Folder Revolve Swap Wipe Fade Blur Reflection Using specific location between Z-axis, move or enlarges Screen B moves to specific direction, overlapping screen A Pivot is located in front of a side and side, rotating Rotate on the corner of X-axis Rotate on the corner of Y-axis Rotate on an axis between A and B three-dimensionally located Area domain of the page disappears Transparency of a page steadily decrease or increase Blurs information element Information elements reflected on the floor Perspective is gained by overlapping effect and express of relative size Another page is located on previously fixed page May rotate two sides like the shape of cube May create page rotation like the shape of folders May create door opening effect Reciprocal location change of sides with cross movement Wiping overlapped page or disappearing the page from certain location Distance and shade is controlled with transparency and color dynamics Expresses perspective by relatively focusing eye Expresses sense of space by showing texture of the floor with the angle or intensity of the reflection Shade Expresses shadows Sense of space of light 220

4 or location or and floor expressed dynamics of the light through shadow Table 5. Transition Components Interaction Characteristics of smart TVs let interaction take place through remote controller, user, and TV screen. Users control TVs through buttons on screen, voice, or movement, the result of which can be checked through TV screen. Such interactions may be categorized as following Table 6. Description Hardware Button The most common intuitive method Touch Pad Frequently used recently Cursor Frequently used recently Rapid search, but low in definitude Wheel Appropriate for lists Voice The most usable if it has high precision Gesture Should have no obstacles between TVs and users, increases fatigue Table 6. Interaction Method Categorization When choosing lower level menus in panels except for multimedia, one may witness zoom on the chosen area. After the choice, it moved with Wipe and Fade transition. When choosing files in multimedia panel or choosing specific application, not lower level menus, from Apps panel, it is either directly synchronized to full screen or shown to the new grid layout. 3 Research on Smart TV 3.1 Analysis Method and Object Smart TVs may be divided into all-in-one(manufacturer centered, such as Samsung/LG/Sony), of which smart functions are included in TV set, set top types, connecting set top box with preexisting TVs(such as Google, Apple TV, and IPTV of agencies), and dongle types, recently appeared(such as google chrome cast). In this chapter, I would like to select representative products of main smart TV manufacturers and set top box companies, and study interface in four perspectives; structure, layout, transition, and interaction. The objective of analysis are texts of the product websites or expert bloggers' reviews and video contents, such as videos of use experience or product review, function introduction or demonstration, or commercial for advertisement. Table.7 Samsung Smart TV Menu Tree 3.2 Samsung Smart TV User Interface Analysis 2014 Samsung Smart TV has On TV screen, which is the one being run real time among app, real time TV, VOD contents, photo & music, and game. Each menus have structures like Table 7. When first entering through smart hub hardware button, folder transition effect is shown, which means lower lever information of each panel located with the forms of grid and tab rotates on the edge of X-axis. When 5 upper panels and panels move, transition takes place as if big cube is moving. Use of Blur and Shade to express depth between each information is also noticeable. When operating upper panels, one may swipe touch pad or push hardware button, and one may also use voice search or hardware button to enter when searching. If one has a camera, gesture perception is possible, which enables active interaction between the viewer and TV. Table.8 Samsung Smart TV Smart Hub In case of panel change, deepening of depth in one panel caused by choice of lower lever menus, or transition into new full screen by choosing application, different grid layout is used for each. It seems that lack of clear interface design in 221

5 application development guideline caused the use of complex grid layout, which shows limitations of interface. 3.3 LG Smart TV User Interface Analysis Every function of 2014 LG Web OS smart TV is composed in each application forms. When smart TV button is pushed, practicable applications overlays on the screen the viewer was watching or they used. On the left, there are menus to help viewers access recently used functions, while on the right, there are expandable menus which allows viewers to access other applications that are not on screen. Applications are connected in list structures. They are composed with Overlay, Split, or Full Screen forms depending on the characteristics of lower level menus. When pushing applications to activate them or pushing menus to enter, menus are shown with Slide, Overlay, Swap, or Wipe. For operation, hardware buttons, touch pad, or voice control is possible. LG smart TV is comprised of independent application, so the depth of information is not rich comparing with Samsung smart TV. However, each application runs by keeping a consistent grid layout and interface design. 4 Conclusion As digital devices become increasingly complicated, TV, which is used to portray image contents, are now including smart functions. However, complicated interaction methods and unnecessary functions caused many other problems. In this study seeks to categorize and analyze smart TV user interface and structuralize those information which may help framing new future interface design before looking into the solutions for the problems. Therefore, analysis of smart device user interface category and structure with existing literature research, and categorizing and structuralizing those information based on whether they may be applied to smart TVs is conducted through this study. Finally, each smart TV has different user interface and menu structure. There are no concrete rule for user interface, so it is hard to make a mental model of the users. This study does include the user interface analysis of Samsung and LG Smart TV, but does not include the users preferences. Future research is planned for user research and their preferences. A clear understanding of users demands and users utilizing smart TV has diversified. Categorization of user interface and understanding users demands will enhance the user interface of smart TV and be reached the goal of smart TV. Table.9 LG Smart TV Menu Tree References [1] Kim, Jiyong. A Study of classification and application for Transition effect in Graphic User Interface. Kookmin University, 2010 [2] Kim, Hyekyung. Comparison Analysis of Web Interface with Focus on Users from the Service Design Viewpoint. Hongik University, 2012 [3] Kim, Hyunjeong. A Study on Defining User-centered contents and features of Smart TV. Kyungsung University, 2013 [4] Lee, Jongyoon and Juhyun Eune. A Study on acceptance factors of smart TVs. Archives of design research, Vol. 26, No.1, pp , 2013 [5],,. TV UX UI [6] Oh, Youngmi. A Study on the Design Guideline of Smart TV. Journal of Digital Interaction Design, Vol.12, No.1, 2013 [7] Yoo, Seunghun. A Study on Task-UX Matching of Multi-functioned Controller UX in Smart TV Environment. Hongik University, 2012 Table.10 LG Smart TV Home Full screen is shown on grid layout when entering each application. List of menus appear, covering about 1/3 of the right side, when pushing upper level menus on the right. 222