WO2024080500A1 - 전자 장치 및 그 ui 제공 방법 - Google Patents

전자 장치 및 그 ui 제공 방법 Download PDF

Info

Publication number
WO2024080500A1
WO2024080500A1 PCT/KR2023/009426 KR2023009426W WO2024080500A1 WO 2024080500 A1 WO2024080500 A1 WO 2024080500A1 KR 2023009426 W KR2023009426 W KR 2023009426W WO 2024080500 A1 WO2024080500 A1 WO 2024080500A1
Authority
WO
WIPO (PCT)
Prior art keywords
group
title
list
length
display
Prior art date
Application number
PCT/KR2023/009426
Other languages
English (en)
French (fr)
Inventor
서장원
김석현
김정근
문주선
최아름
Original Assignee
삼성전자주식회사
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by 삼성전자주식회사 filed Critical 삼성전자주식회사
Priority to US18/241,692 priority Critical patent/US20240118789A1/en
Publication of WO2024080500A1 publication Critical patent/WO2024080500A1/ko

Links

Images

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0481—Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance
    • G06F3/04812—Interaction techniques based on cursor appearance or behaviour, e.g. being affected by the presence of displayed objects
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0481—Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance
    • G06F3/04817—Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance using icons
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0481—Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance
    • G06F3/0482—Interaction with lists of selectable items, e.g. menus
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0484—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
    • G06F3/04842—Selection of displayed objects or displayed text elements
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0484—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
    • G06F3/0485—Scrolling or panning

Definitions

  • This disclosure relates to an electronic device and a method of providing a UI, and more specifically, to an electronic device that provides a UI screen including a plurality of GUI items and a method of providing the UI.
  • display devices such as TVs provide various contents to meet the needs of users who want various functions and new experiences.
  • An electronic device may include a display, a memory storing one or more instructions, and one or more processors connected to the display and the memory to control the electronic device.
  • the one or more processors by executing the one or more instructions, divide the display into (i) a first group including one or more first GUI items and (ii) a second group including one or more second GUI items.
  • the display can be controlled to display the changed title by changing the length of one or more titles in the second group.
  • the one or more processors may display the titles of the first group within the changed list length.
  • the display can be controlled to display the changed title by changing the title length of the first group to include the title.
  • the one or more processors by executing the one or more instructions, move the GUI items included in the list to one side, change the list length corresponding to the first group, and change the length of the title of the first group. and if the difference between the lengths of the changed list of the first group is identified as being within the threshold length range, the end of the title of the first group is adjusted so that the title of the first group is included within the changed list length of the first group. It can be shortened.
  • the one or more processors may change the list length of the first group according to a reverse scroll input by executing the one or more instructions, and change the length of the title of the first group and the changed list length of the first group. If the difference is identified as being outside the threshold length range, the display can be controlled to redisplay the text of the shortened portion.
  • the one or more processors by executing the one or more instructions, control the display to display a movable focus item on one of the one or more first GUI items according to the scroll input.
  • the movable focus item is moved to one of the one or more first GUI items or one of the one or more second GUI items and the list length corresponding to the first group is changed, the second GUI item is changed based on the changed list length.
  • the display can be controlled to change the length of 1 group of titles.
  • the one or more processors control the display to display a fixed focus item on one of the one or more first GUI items by executing the one or more instructions, and control the one or more first GUI items according to the scroll input.
  • the title length of the first group is changed based on the changed list length to display the changed title. You can control the display.
  • the one or more processors control the display to display a cursor item by executing the one or more instructions, and the pointer item is positioned on any one of the one or more first GUI items. In this state, if the list length corresponding to the first group changes according to the scroll input, the display can be controlled to display the changed title by changing the title length of the first group based on the changed list length. .
  • the one or more processors display the changed list length and the title of the first group. Based on the type, the display can be controlled to display the titles of the first group by abbreviating them or to replace the titles of the first group with summary titles.
  • the one or more processors by executing the one or more instructions, when the list length corresponding to the first group is shortened to less than the title length of the first group according to a leftward scroll input, the first group
  • the display is controlled to shorten and display at least one of the plurality of words included in the title
  • the display is displayed.
  • the display can be controlled to shorten and display at least one of a plurality of words included in the title of the second group.
  • the one or more processors by executing the one or more instructions, when the list length corresponding to the first group is shortened to less than the title length of the first group according to a leftward scroll input, the first group
  • the display is controlled to replace the title with a summary title, and when the list length corresponding to the second group is shortened to less than the title length of the second group according to a rightward scroll input, the title of the second group is summarized.
  • the display can be controlled to display a title instead.
  • a method of providing a UI of an electronic device includes a list identified as (i) a first group including one or more first GUI items and (ii) a second group including one or more second GUI items. displaying the title of the first group at least one of the top or bottom of the first group and displaying the title of the second group at least one of the top or bottom of the second group, and displaying the title of the first group at least one of the top or bottom of the second group, and When the list length corresponding to at least one of the first group or the second group changes according to a scroll input, the title length of at least one of the first group or the second group is changed based on the changed list length. A step of displaying the changed title may be included.
  • a non-transitory computer-readable medium storing computer instructions that, when executed by a processor of an electronic device, cause the electronic device to perform an operation, wherein the operation includes one or more first GUI items, according to one or more embodiments. Displays a list identified as a first group and a second group including one or more second GUI items, displays the title of the first group at least one of the top or bottom of the first group, and displays the list of the second group.
  • the changed list length It may include changing the length of one or more titles of the first group or the second group based on the list length and displaying the changed title.
  • FIG. 1 is a diagram for explaining an implementation example of an electronic device according to one or more embodiments of the present disclosure.
  • FIG. 2A is a block diagram showing the configuration of an electronic device according to one or more embodiments.
  • FIG. 2B is a block diagram specifically illustrating the configuration of an electronic device according to one or more embodiments.
  • Figure 3 is a flowchart illustrating a method of providing a UI screen according to one or more embodiments.
  • FIG. 4 is a flowchart explaining in detail the method of providing the UI screen shown in FIG. 3.
  • Figures 5 and 6 are diagrams for explaining a method of providing a UI screen according to a moving focus method according to one or more embodiments.
  • FIG. 7 and 8 are diagrams for explaining a method of providing a UI screen according to a fixed focus method according to one or more embodiments.
  • Figure 9 is a diagram for explaining a method of providing a UI screen according to a cursor movement method according to one or more embodiments.
  • Figure 10 is a diagram for explaining a method of providing a UI screen according to a touch method according to one or more embodiments.
  • FIG. 11 is a diagram illustrating a method of providing a UI screen according to a reverse scroll input according to one or more embodiments.
  • Figure 12 is a diagram for explaining a method of providing a UI screen according to a scroll input according to one or more embodiments.
  • Figure 13 is a diagram for explaining a method of providing a UI screen according to a scroll input according to one or more embodiments.
  • FIGS. 14, 15A, and 15B are diagrams for explaining a method of providing a UI screen according to one or more embodiments by using one or more implementation examples.
  • expressions such as “have,” “may have,” “includes,” or “may include” refer to the presence of the corresponding feature (e.g., a numerical value, function, operation, or component such as a part). , and does not rule out the existence of additional features.
  • expressions such as “A or B,” “at least one of A or/and B,” or “one or more of A or/and B” may include all possible combinations of the items listed together.
  • expressions such as “first,” “second,” “first,” or “second,” can modify various components regardless of order and/or importance, and can refer to one component. It is only used to distinguish from other components and does not limit the components.
  • a component e.g., a first component
  • another component e.g., a second component
  • connection to it should be understood that a certain component can be connected directly to another component or connected through another component (e.g., a third component).
  • the expression “configured to” used in the present disclosure may mean, for example, “suitable for,” “having the capacity to,” depending on the situation. ,” can be used interchangeably with “designed to,” “adapted to,” “made to,” or “capable of.”
  • the term “configured (or set to)” may not necessarily mean “specifically designed to” in hardware.
  • the expression “a device configured to” may mean that the device is “capable of” working with other devices or components.
  • the phrase "processor configured (or set) to perform A, B, and C" refers to a processor dedicated to performing the operations (e.g., an embedded processor), or by executing one or more software programs stored on a memory device.
  • a “module” or “unit” performs at least one function or operation, and may be implemented as hardware or software, or as a combination of hardware and software. Additionally, a plurality of “modules” or a plurality of “units” may be integrated into at least one module and implemented with at least one processor, except for “modules” or “units” that need to be implemented with specific hardware.
  • FIG. 1 is a diagram for explaining an implementation example of an electronic device according to one or more embodiments of the present disclosure.
  • the electronic device 100 may be implemented with various types of display devices.
  • the electronic device 100 may be a TV, tablet PC, mobile phone, desktop PC, laptop PC, PDA, portable multimedia player (PMP), large format display (LFD), digital signage, or digital signage (DID).
  • Any device having a display function such as an information display, video wall, projector, refrigerator, air conditioner, air purifier, medical device, or device well known to those skilled in the art, is applicable without limitation.
  • the electronic device 100 may be remotely controlled based on a control signal received from a device having a remote control function, such as a remote control device (not shown) or a user terminal (not shown) running a remote control application.
  • a remote control device such as a remote control device (not shown) or a user terminal (not shown) running a remote control application.
  • the electronic device 100 can be controlled by a user's input, for example, a user's touch input.
  • the electronic device 100 provides a UI (User Interface) screen including a plurality of Graphic User Interface (GUI) items and displays the plurality of GUI based on a navigation input received from a remote control device (not shown). You can control navigation between items.
  • UI User Interface
  • GUI Graphic User Interface
  • the electronic device 100 may provide a UI screen including a plurality of GUI items having various sizes and/or various ratios and a focus item located in any one of these GUI items.
  • the electronic device 100 may display a plurality of GUI items arranged on the same list by moving them in one direction based on a scroll input received from the remote control device.
  • GUI items corresponding to a plurality of groups may be provided on one list.
  • the group title corresponding to each group may be provided on one side of the list corresponding to each group.
  • GUI items corresponding to the “Accessories&Music” group and GUI items corresponding to the “Apps&Devices” group may be provided on one list 10, and the titles of each group may be provided aligned at the top left of the group.
  • the list length corresponding to one of the plurality of groups becomes shorter than the group title, which may cause the titles of the plurality of groups to collide with each other and be displayed.
  • FIG. 2A is a block diagram showing the configuration of an electronic device according to one or more embodiments.
  • the electronic device 100 includes a display 110, a memory 120, and one or more processors 130.
  • the display 110 may be implemented as a display including a self-emitting device or a display including a non-emitting device and a backlight.
  • a display including a self-emitting device or a display including a non-emitting device and a backlight.
  • LCD Liquid Crystal Display
  • OLED Organic Light Emitting Diodes
  • LED Light Emitting Diodes
  • micro LED micro LED
  • Mini LED Plasma Display Panel
  • PDP Plasma Display Panel
  • QD Quantum dot
  • QLED quantum dot light-emitting diodes
  • the display 110 may also include a driving circuit and a backlight unit that may be implemented in the form of a-si TFT, low temperature poly silicon (LTPS) TFT, or organic TFT (OTFT).
  • LTPS low temperature poly silicon
  • OFT organic TFT
  • a touch sensor that detects a touch operation in the form of a touch film, touch sheet, touch pad, or other touch mechanism known to those skilled in the art is disposed on the front of the display 110 to enable various types of touch input. It can be implemented to be detectable.
  • the display 110 can detect various types of touch input, such as a touch input by the user's hand, a touch input by an input device such as a stylus pen, and a touch input by a specific electrostatic material.
  • the input device may be implemented as a pen-type input device that can be referred to by various terms such as an electronic pen, stylus pen, and S-pen.
  • the display 110 may be implemented as a flat display, a curved display, a flexible display capable of folding and/or rolling, or other display configurations known to those skilled in the art.
  • the memory 120 may store data necessary for various embodiments.
  • the memory 120 may be implemented as a memory embedded in the electronic device 100' or as a memory detachable from the electronic device 100, depending on the data storage purpose. For example, in the case of data for driving the electronic device 100, it is stored in a memory embedded in the electronic device 100', and in the case of data for the expansion function of the electronic device 100, it is attached and detachable from the electronic device 100. This can be stored in available memory.
  • volatile memory e.g., dynamic RAM (DRAM), static RAM (SRAM), or synchronous dynamic RAM (SDRAM), etc.
  • non-volatile memory Examples: one time programmable ROM (OTPROM), programmable ROM (PROM), erasable and programmable ROM (EPROM), electrically erasable and programmable ROM (EEPROM), mask ROM, flash ROM, flash memory (e.g. NAND flash or NOR flash, etc.) ), a hard drive, or a solid state drive (SSD).
  • a memory card for example, a compact memory card (CF) may be used.
  • USB Universal Serial Bus
  • SD Secure Digital
  • Micro-SD micro secure digital
  • Mini-SD mini secure digital
  • xD extreme digital
  • MMC multi-media card
  • external memory that can be connected to a USB port (For example, USB memory) or other types of memory known to those skilled in the art.
  • One or more processors 130 generally control the operation of the electronic device 100. Specifically, one or more processors 130 may be connected to each component of the electronic device 100 and generally control the operation of the electronic device 100. For example, one or more processors 130 may be electrically connected to the display 110 and the memory 120 to control the overall operation of the electronic device 100. The processor 130 may be comprised of one or multiple processors.
  • One or more processors 130 may perform operations of the electronic device 100 according to various embodiments by executing one or more instructions stored in the memory 120.
  • One or more processors 130 include a CPU (Central Processing Unit), GPU (Graphics Processing Unit), APU (Accelerated Processing Unit), MIC (Many Integrated Core), DSP (Digital Signal Processor), NPU (Neural Processing Unit), and hardware. It may include one or more of an accelerator or machine learning accelerator. One or more processors 130 may control one or any combination of other components of the electronic device and may perform operations related to communication or data processing. One or more processors 130 may execute one or more programs or instructions stored in memory. For example, one or more processors may perform a method according to one or more embodiments of the present disclosure by executing one or more instructions stored in memory.
  • the plurality of operations may be performed by one processor or by a plurality of processors.
  • the first operation, the second operation, and the third operation may all be performed by the first processor.
  • the first and second operations may be performed by a first processor (e.g., a general-purpose processor) and the third operation may be performed by a second processor (e.g., an artificial intelligence-specific processor).
  • the one or more processors 130 may be implemented as a single core processor including one core, or one or more multi-cores including a plurality of cores (e.g., homogeneous multi-core or heterogeneous multi-core). It may also be implemented as a processor (multicore processor). When one or more processors 130 are implemented as multi-core processors, each of the plurality of cores included in the multi-core processor may include processor internal memory such as cache memory and on-chip memory, and may include a plurality of cores. A common cache shared by cores may be included in multi-core processors.
  • each of the plurality of cores (or some of the plurality of cores) included in the multi-core processor may independently read and perform program instructions for implementing the method according to one or more embodiments of the present disclosure, and the plurality of cores may Program instructions for implementing a method according to one or more embodiments of the present disclosure may be read and performed in conjunction with all (or part of) the present disclosure.
  • the plurality of operations may be performed by one core among a plurality of cores included in a multi-core processor, or may be performed by a plurality of cores. It may be possible.
  • the first operation, the second operation, and the third operation are performed by the method according to one or more embodiments, the first operation, the second operation, and the third operation are all included in the multi-core processor. It may be performed by one core, and the first operation and the second operation may be performed by the first core included in the multi-core processor, and the third operation may be performed by the second core included in the multi-core processor.
  • a processor may mean a system-on-chip (SoC) in which one or more processors and other electronic components are integrated, a single-core processor, a multi-core processor, or a core included in a single-core processor or a multi-core processor.
  • SoC system-on-chip
  • the core may be implemented as a CPU, GPU, APU, MIC, DSP, NPU, hardware accelerator, or machine learning accelerator, but embodiments of the present disclosure are not limited thereto.
  • processor 130 for convenience of explanation, one or more processors 130 will be referred to as processor 130.
  • FIG. 2B is a block diagram specifically illustrating the configuration of an electronic device according to one or more embodiments.
  • the electronic device 100' includes a display 110, a memory 120, one or more processors 130, a communication interface 140, a user interface 150, a speaker 160, and a sensor 170. may include.
  • a display 110 includes a display 110, a memory 120, one or more processors 130, a communication interface 140, a user interface 150, a speaker 160, and a sensor 170.
  • processors 130 may include a communication interface 140, a user interface 150, a speaker 160, and a sensor 170.
  • the communication interface 140 may be implemented as various interfaces depending on the implementation example of the electronic device 100'.
  • the communication interface 140 includes Bluetooth, AP-based Wi-Fi (Wireless LAN network), Zigbee, wired/wireless LAN (Local Area Network), WAN (Wide Area Network), Ethernet, IEEE 1394, HDMI (High-Definition Multimedia Interface), USB (Universal Serial Bus), MHL (Mobile High-Definition Link), AES/EBU (Audio Engineering Society/ European Broadcasting Union), Optical , Coaxial or other communication methods known to those skilled in the art may be used to communicate with external devices, external storage media (eg, USB memory), external servers (eg, web hard drives), etc.
  • the communication interface 140 may communicate with a remote control device (not shown) or/and a user terminal (not shown) having a remote control function.
  • the user interface 150 may be implemented with devices such as buttons, touch pads, mice, and keyboards, or with a touch screen that can also perform the display function and manipulation input function described above.
  • the speaker 160 may be configured to output not only various audio data but also various notification sounds or voice messages.
  • the processor 130 may control the speaker to output information corresponding to the UI screen or various notifications in audio format according to various embodiments of the present disclosure.
  • Sensor 170 may include various types of sensors, such as a touch sensor, proximity sensor, acceleration sensor, geomagnetic sensor, gyro sensor, pressure sensor, position sensor, light sensor, or other sensors known to those skilled in the art.
  • sensors such as a touch sensor, proximity sensor, acceleration sensor, geomagnetic sensor, gyro sensor, pressure sensor, position sensor, light sensor, or other sensors known to those skilled in the art.
  • the electronic device 100' may include a camera, a microphone, a tuner, a demodulator, or other components known to those skilled in the art, depending on the implementation.
  • the camera can be turned on and take pictures according to a preset event.
  • the camera can convert the captured image into an electrical signal and generate image data based on the converted signal.
  • a subject is converted into an electrical image signal through a semiconductor optical device (CCD; Charge Coupled Device), and the converted image signal can be amplified and converted into a digital signal and then processed.
  • CCD semiconductor optical device
  • the microphone is designed to receive the user's voice or other sounds and convert them into audio data.
  • the electronic device 100' may receive a user's voice input through an external device through the communication interface 140.
  • the tuner can receive RF broadcast signals by tuning a channel selected by the user or all previously stored channels among RF (Radio Frequency) broadcast signals received through an antenna.
  • RF Radio Frequency
  • the demodulator may receive and demodulate the digital IF signal (DIF) converted from the tuner and perform channel decoding, etc.
  • DIF digital IF signal
  • the processor 130 may provide a UI screen including GUI items having various sizes and/or various ratios.
  • the GUI item may include various types of images or/and text corresponding to various types of content, such as image content, video content, applications, and advertising content.
  • a GUI item may be a thumbnail, representative image, title, description, etc. that represents the content, but may also include an image or/and text that can identify the content.
  • the processor 130 may group and display GUI items.
  • grouping and display may mean that GUI items included in one group are displayed in different areas to distinguish them from GUI items included in another group.
  • the processor 130 may display the title of each group at least at the top or bottom of each group.
  • the processor 130 may display the group title at the top of each group in a left-aligned manner, but it is not necessarily limited to this. For example, it is possible to display left-aligned at the bottom of each group, or right-aligned at the top of each group.
  • multiple groups may be displayed on one list. That is, GUI items included in each of a plurality of groups may be displayed as moving in one direction in conjunction with a scroll input.
  • scrolling means moving the information displayed on the screen up and down or left and right. If the amount of information displayed on the screen exceeds one screen, the entire information already displayed on the screen can move up and down or left and right.
  • Scroll input may include various user commands that cause scrolling.
  • Figure 3 is a flowchart illustrating a method of providing a UI screen according to one or more embodiments.
  • processor 130 displays a list identified as a first group containing one or more first GUI items and a second group containing one or more second GUI items. (110) can be controlled (S310). Additionally, the processor 130 displays the title of the first group at least one of the top or bottom of the display area of the first group item and displays the title of the second group at least one of the top or bottom of the display area of the second group item. It can be displayed (S320).
  • steps S310 and S320 are described separately for convenience of explanation, but it goes without saying that the GUI items and group titles of each group are displayed simultaneously.
  • the processor 130 may identify whether the length of the list corresponding to at least one of the first group or the second group changes (S340).
  • the processor 130 may identify whether the change value of the list length corresponding to at least one of the first group or the second group is greater than or equal to the threshold length.
  • the threshold length may be set differently depending on the list length corresponding to each group. For example, the threshold length may be determined differently depending on the list length corresponding to each group currently displayed on the screen.
  • the processor 130 may identify whether the difference between the first group of title lengths (or second group of title lengths) and the first group of list lengths (or second group of list lengths) is within a threshold length range. You can.
  • the threshold length range may be a preset value, and the length of the title of the first group (or the length of the title of the second group) and the changed list length of the first group (or the list length of the second group) are almost similar. It can be determined by value.
  • the processor 130 When the processor 130 identifies that the list length corresponding to at least one of the first group or the second group has changed (S340:Y), the processor 130 changes the title length of one or more of the first group or the second group based on the changed list length.
  • the display 110 can be controlled to display changes (S350). According to one example, if the change value of the list length corresponding to at least one of the first group or the second group is greater than or equal to the threshold length, the processor 130 changes the title length of one or more of the first group or the second group and displays the display. (110) can be controlled.
  • the processor 130 selects the first group or the first group if the difference between the title length of the first group (or the title length of the second group) and the list length of the first group (or the list length of the second group) is within the threshold length range.
  • the display 110 can be controlled to display the title by changing the length of one or more of the two groups.
  • the processor 130 configures the display 110 to change and display the title length of the first group when the list length corresponding to the first group becomes shorter than the title length of the first group according to a leftward scroll input. You can control it. In addition, the processor 130 controls the display 110 to change and display the title length of the second group when the list length corresponding to the second group becomes shorter than the title length of the second group according to the rightward scroll input. You can.
  • FIG. 4 is a flowchart explaining in detail the method of providing the UI screen shown in FIG. 3.
  • GUI items included in the list may be moved to one side and the list length corresponding to the first group may be changed ( S420).
  • the processor 130 may identify whether the difference between the length of the title of the first group and the length of the changed list of the first group is within the threshold length range (S430).
  • the critical length range may be a preset value and may be determined as a value such that the length of the title of the first group and the length of the changed list of the first group are almost similar. That is, the processor 130 may identify whether the difference between the length of the title of the first group and the length of the changed list of the first group becomes similar with a small margin.
  • the processor 130 When the processor 130 identifies that the difference between the length of the title of the first group and the length of the changed list of the first group is within the threshold length range (S430:Y), the processor 130 shortens the end of the title of the first group ( or omitted) (S440). That is, the processor 130 may shorten the end of the first group's titles so that the first group's titles are included within the changed list length of the first group.
  • abbreviation processing may include processing using ellipses such as "", but is not necessarily limited thereto, and is applicable without limitation as long as it is an indication that the remaining part has been abbreviated (or omitted). For example, referring to Figure 1, the title of the “Accessories & Music” group may be shortened to “Accessories & Mu...”.
  • the processor 130 may shorten the end of the title of the first group and then identify whether the list length of the first group changes according to the reverse scroll input (S450).
  • the processor 130 determines that the difference between the length of the title of the first group and the length of the changed list of the first group is outside the threshold length range according to the reverse scroll input (S460:Y), the processor 130 corresponds to the shortened portion.
  • the text can be displayed repeatedly (S470). For example, when the length of the list of the first group becomes long enough to display the text at the end of the title of the first group according to the reverse scroll input, the processor 130 displays the text corresponding to the shortened portion again. can do.
  • the processor 130 may shorten the appropriate text portion based on the text type of the group title. For example, if the group title is a type that contains one word (e.g., Sonsored), or a type that contains multiple consecutive words (e.g., Recently Played), the end of the title may be shortened. You can. As another example, if the group title is a type in which multiple words are joined by & and the length of the title word placed at the front is relatively long, the title word placed at the front can be shortened. Accordingly, the user can recognize at least part of each of the plurality of words even if the group title is shortened.
  • the group title is a type that contains one word (e.g., Sonsored), or a type that contains multiple consecutive words (e.g., Recently Played)
  • the end of the title may be shortened. You can.
  • the group title is a type in which multiple words are joined by & and the length of the title word placed at the front is relatively long, the title word placed
  • the processor 130 may replace the group title with summary text and display it.
  • the group title can be replaced with a summarized word rather than an abbreviation such as ..
  • the group text is abc def ghi, it can be replaced with summary text such as ADG, or it can be replaced with summary text such as abc.
  • the summary text may take various forms depending on the type of group title. For example, Recently Played can be replaced with summary text that the user can recognize, such as “Recently P” or “Recently.”
  • the processor 130 may identify whether to shorten the appropriate text portion or replace it with summary text based on the text type of the group title. For example, the group title can be shortened or replaced with summary text based on the user's recognition of the shortened or summarized text. Recognition may correspond to the likelihood that an abbreviated version of the title will be recognized.
  • the scroll input may be a preset navigation input, for example, a pressing operation (e.g., long press input) on a specific button provided in a remote control device (not shown), a touch scroll operation, Input may be performed in various forms depending on the implementation type of the electronic device 100, such as scroll button operation or continuous key input on a wheel input device.
  • the scroll control method of the list may include various types such as a moving focus method, a fixed focus method, and a cursor (or pointer) movement method.
  • a method of providing a UI screen corresponding to various types of scroll control methods will be described with reference to the drawings.
  • Figures 5 and 6 are diagrams for explaining a method of providing a UI screen according to a moving focus method according to one or more embodiments.
  • the processor 130 controls the display 110 to display a movable focus item on any one of the one or more first GUI items included in the first group.
  • the movable focus item is an item for controlling the scrolling of the list according to the movable focus method. According to the scroll input, the movable focus item can be moved in one direction and the GUI items included in the list can be moved in the opposite direction.
  • GUI items may be arranged horizontally, vertically, diagonally, or in another suitable direction and may have a specific shape (e.g., square, rounded square, circle, diamond, etc.).
  • the focus item may be highlighted on the border of the GUI item, but is not necessarily limited to this and may be highlighted on the entire GUI item or on some borders.
  • the movable focus item is selected from another one of the one or more first GUI items included in the first group or one of the one or more second GUI items included in the second group.
  • the list length corresponding to the first group may be changed by moving to one (S530).
  • the processor 130 may identify whether the difference between the title length of the first group and the changed list length is within the threshold length range (S540).
  • the processor 130 identifies (or determines) that the difference between the length of the title of the first group and the length of the changed list of the first group is within the threshold length range (S540:Y), the end of the title of the first group can be shortened (or omitted) (S550).
  • the processor 130 may display the UI screen 600 as shown in the upper part of FIG. 6.
  • the UI screen 600 may include various menu items 601, 602, 603, 604, and 605 and a plurality of GUI item lists 610, 620, 630, and 640.
  • the GUI items 631, 632, 633 included in the first group (Accessories&Music group) and the GUI items 634, 635, 636, 637, 638 included in the second group (Apps&Devices group) are one It may be provided on a list 630.
  • the first group (Accessories&Music group) may be displayed in the left area of the list 630
  • the second group (Apps&Devices group) may be displayed in the right area of the list 630.
  • a list may correspond to items contained in the same row, column, or tile of the display.
  • the title of the first group i.e., “Accessories&Music”
  • the title of the second group i.e., “Apps&Devices”
  • a movable focus item 20 may be displayed on any one GUI item 633 included in the first group (Accessories&Music group).
  • the position of the movable focus item 20 is moved to the GUI item 634 included in the second group (Apps&Devices group), and the GUI items included in the list 630 are moved to the left.
  • the GUI item 631 located at the front of the list 630 disappears from the screen and the list length corresponding to the first group (Accessories&Music group) becomes shorter, while a new GUI item 639 is displayed and the second group becomes shorter.
  • the length of the list corresponding to the group (Apps&Devices group) becomes longer.
  • the processor 130 may shorten the titles of the first group.
  • the end of "Accessories&Music” can be summarized as "Accessories".
  • the title of the first group collides with the title of the second group (i.e., Apps&Devices) and is not displayed.
  • FIG. 7 and 8 are diagrams for explaining a method of providing a UI screen according to a fixed focus method according to one or more embodiments.
  • the processor 130 may control the display 110 to display a fixed focus item on any one of one or more first GUI items included in the first group.
  • the fixed focus item is an item to control the scrolling of the list according to the fixed focus method.
  • the position of the fixed focus item is fixed and the GUI items included in the list are moved in the scroll direction and are not provided on the UI screen. New GUI items that are not yet available may be provided on the UI screen.
  • the processor 130 may identify whether the difference between the title length of the first group and the changed list length is within the threshold length range (S740).
  • the processor 130 When the processor 130 identifies that the difference between the length of the title of the first group and the length of the changed list of the first group is within the threshold length range (S740:Y), the processor 130 shortens the end of the title of the first group ( or omitted) (S750).
  • the processor 130 may display the UI screen 600 as shown in the upper part of FIG. 8. Since the configuration of the UI screen displayed at the top of FIG. 8 is similar to the configuration of the UI screen displayed at the top of FIG. 6, redundant description will be omitted. However, unlike Figure 6, in Figure 8, on the list 630 including the first group of GUI items (631, 632, 633) and the second group of GUI items (634, 635, 636, 637, 638) A fixed focus item 30 may be located on the GUI item 631 located at the front.
  • GUI items 632 belonging to the first group are moved to the position of the fixed focus item 30, and the GUI items included in the list 630 are moved to the left or right.
  • the GUI item 631 located at the front of the list 630 disappears from the screen and the list length corresponding to the first group (Accessories&Music group) becomes shorter, while a new GUI item 639 is displayed and the second group becomes shorter.
  • the length of the list corresponding to the group (Apps&Devices group) becomes longer. Accordingly, the length of the title corresponding to the first group (Accessories&Music group), that is, “Accessories&Music,” may be shortened to less than the length of the changed list of the first group.
  • the processor 130 may display the end of the title of the first group, i.e., “Accessories&Music,” as an abbreviation, i.e., “Accessories...”. Accordingly, the title of the first group collides with the title of the second group (i.e., Apps&Devices) and is not displayed. For example, it is possible to prevent titles of the first group from being displayed overlapping with titles of the second group.
  • Figure 9 is a diagram for explaining a method of providing a UI screen according to a cursor movement method according to one or more embodiments.
  • the processor 130 may provide a cursor item 40 on the UI screen 600 .
  • the cursor item 40 may be controlled by the remote control device 910 as shown in FIG. 9, but is not necessarily limited thereto.
  • the control function of the cursor item 40 may be implemented in various forms, but for convenience of explanation, it is assumed that the movement direction of the cursor item 40 and the movement direction of the list are opposite directions. That is, when the cursor item 40 moves to the right, the list is assumed to move to the left.
  • the GUI item included in the second group (Apps&Devices group) ( As the list 634 moves to the right, the GUI items included in the list 630 may move to the left.
  • the GUI item 631 located on the far left (for example, the start of the list) on the list 630 disappears from the screen, and the list length corresponding to the first group (Accessories&Music group) becomes shorter, while the new GUI item As (639) is displayed, the length of the list corresponding to the second group (Apps&Devices group) becomes longer.
  • the processor 130 may shorten the titles of the first group.
  • “Accessories&Music” can be summarized as “Accessories".
  • the title of the first group collides with the title of the second group (i.e., Apps&Devices) and is not displayed.
  • Figure 10 is a diagram for explaining a method of providing a UI screen according to a touch method according to one or more embodiments.
  • the UI screen 600 may be provided on a display screen capable of touch input.
  • the UI screen 600 may be provided on a display screen such as a tablet.
  • GUI items can be moved to the left.
  • the GUI item 631 located at the front of the list 630 disappears from the screen and the list length corresponding to the first group (Accessories&Music group) becomes shorter, while a new GUI item 639 is displayed and the second group becomes shorter.
  • the length of the list corresponding to the group (Apps&Devices group) becomes longer.
  • the processor 130 may shorten the titles of the first group.
  • “Accessories&Music” can be summarized as “Accessories".
  • the title of the first group collides with the title of the second group (i.e., Apps&Devices) and is not displayed.
  • FIG. 11 is a diagram illustrating a method of providing a UI screen according to a reverse scroll input according to one or more embodiments.
  • the upper view of FIG. 11 may be the same as the lower view of FIG. 6. That is, in the upper drawing of FIG. 11, the position of the movable focus item 20 is moved to the GUI item 634 included in the second group (Apps&Devices group) according to the scroll input, and the GUI items included in the list 630 are moved to the left. It may be moved in one direction. Accordingly, the end of the title of the first group, i.e., “Accessories&Music,” may be shortened, i.e., displayed as “Accessories...”.
  • the processor 130 changes the position of the movable focus item 20 from the GUI item 634 included in the second group (Apps & Devices group) to the first group (Accessories & Music) according to the reverse scroll input in the direction opposite to the previous scroll direction.
  • the GUI items 633 included in the group may be moved to the right.
  • the GUI item 631 located at the front of the list 630 is displayed on the screen again, and the list length corresponding to the first group (Accessories&Music group) becomes longer, while the GUI item 639 disappears from the screen.
  • the list length increases, the length of the list corresponding to the second group (Apps&Devices group) becomes shorter.
  • the processor 130 may restore the shortened titles of the first group to their original state.
  • the text corresponding to the abbreviated part of the title of the first group, which was displayed as “Accessories", can be displayed again and displayed as "Accessories&Music.”
  • Figure 12 is a diagram for explaining a method of providing a UI screen according to a scroll input according to one or more embodiments.
  • Figure 12 is a diagram for explaining another example of group title shortening processing.
  • the end portion is abbreviated, but it is not necessarily limited to this.
  • the middle portion not the end, may be shortened.
  • the first group's title “Accessorie&Music” can be shortened to "Acce..&Music”.
  • the processor 130 can shorten the appropriate text portion based on the text type of the group title. For example, as shown, if the group title is a type in which multiple words are joined by & and the length of the title word placed at the front is longer than the word threshold, the title word placed at the front can be shortened. Accordingly, the user can recognize at least part of each of the plurality of words even if the group title is shortened.
  • Figure 13 is a diagram for explaining a method of providing a UI screen according to a scroll input according to one or more embodiments.
  • Figure 13 is a diagram for explaining another example of group title change processing.
  • ellipses such as "" are used when group title change processing is necessary, but the method is not limited to this.
  • the processor 130 may replace the group title with summary text and display it.
  • the group title may be replaced with a summary title and displayed.
  • the processor 130 may replace the group title with a summarized word rather than an abbreviation process such as "".
  • the title “Accessorie&Music” of the first group can be displayed by replacing it with summary text such as “Acce&Music”.
  • FIGS. 14, 15A, and 15B are diagrams for explaining a method of providing a UI screen according to one or more embodiments as an example of implementation.
  • the processor 130 may compare the group list length (width) and the group title length (width) (S1410).
  • the processor 130 may identify whether the group title length is similar to the group list length or whether the group title length is shorter than the group list length (S1415).
  • the fact that the group title length is similar to the group list length may mean that the length difference is within the critical length range.
  • the processor 130 may shorten the end of the group title as soon as the list scrolling begins (S1420). For example, in Figure 15a, a first group including first GUI items 1511 and 1512 and a second group including second GUI items 1521 and 1522 are included in one list and the first group An example is shown where the title length is similar to the list length of the first group. In this case, the processor 130 may shorten the end of the first group title as soon as the list scrolling begins.
  • the processor 130 may maintain the group title even when the list movement begins and shorten the end of the group title from the moment the group title length becomes similar to the group list length (S1425).
  • the group list length S1425.
  • the processor 130 may maintain the first group title even when the list movement begins, and shorten the end of the first group title from the moment the length of the first group title becomes similar to the length of the first group list.
  • the processor 130 may shorten the group title even before list scrolling begins (S1430).
  • the processor 130 can change the group title length to correspond when the group list length is changed by scrolling (S1435).
  • the processor 130 may identify (or determine) whether the group list has scrolled out of the screen (S1440).
  • the processor 130 may hide the group title from the screen (S1445). That is, the processor 130 can cause the group title to disappear from the screen.
  • the processor 130 may maintain at least part of the group title in the screen.
  • the processor 130 can display at least part of the group title again if it is identified that at least part of the group list that was off the screen is back on the screen (S1445:Y) ( S1460).
  • the list length corresponding to one of the plurality of groups becomes shorter than the group title as the scrolling occurs, so that the titles of the plurality of groups become shorter. This prevents the display from colliding with each other. Accordingly, the user's UX experience on the UI screen can be improved.
  • the methods according to various embodiments of the present disclosure described above may be implemented in the form of applications that can be installed on existing electronic devices.
  • the methods according to various embodiments of the present disclosure described above may be performed using a deep learning-based artificial neural network (or deep artificial neural network), that is, a learning network model.
  • the various embodiments described above may be implemented as software including instructions stored in a machine-readable storage media (e.g., a computer).
  • the device is a device capable of calling instructions stored from a storage medium and operating according to the called instructions, and may include an electronic device (eg, electronic device A) according to the disclosed embodiments.
  • the processor may perform the function corresponding to the instruction directly or using other components under the control of the processor.
  • Instructions may contain code generated or executed by a compiler or interpreter.
  • a storage medium that can be read by a device may be provided in the form of a non-transitory storage medium.
  • 'non-transitory' only means that the storage medium does not contain signals and is tangible, and does not distinguish whether the data is stored semi-permanently or temporarily in the storage medium.
  • the methods according to the various embodiments described above may be included and provided in a computer program product.
  • Computer program products are commodities and can be traded between sellers and buyers.
  • the computer program product may be distributed on a machine-readable storage medium (e.g. compact disc read only memory (CD-ROM)) or online through an application store (e.g. Play StoreTM).
  • an application store e.g. Play StoreTM
  • at least a portion of the computer program product may be at least temporarily stored or created temporarily in a storage medium such as the memory of a manufacturer's server, an application store server, or a relay server.
  • each component e.g., module or program
  • each component may be composed of a single or multiple entities, and some of the sub-components described above may be omitted, or other sub-components may be omitted. Additional components may be included in various embodiments. Alternatively or additionally, some components (e.g., modules or programs) may be integrated into a single entity and perform the same or similar functions performed by each corresponding component prior to integration. According to various embodiments, operations performed by a module, program, or other component may be executed sequentially, in parallel, iteratively, or heuristically, or at least some operations may be executed in a different order, omitted, or other operations may be added. You can.

Landscapes

  • Engineering & Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Human Computer Interaction (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

전자 장치가 개시된다. 전자 장치는, 디스플레이, 하나 이상의 명령어를 저장하는 메모리 및, 디스플레이 및 메모리와 연결되어 전자 장치를 제어하는 하나 이상의 프로세서를 포함한다. 하나 이상의 프로세서는, 하나 이상의 명령어를 실행함으로써, 하나 이상의 제1 GUI 아이템을 포함하는 제1 그룹 및 하나 이상의 제2 GUI 아이템을 포함하는 제2 그룹으로 식별된 리스트를 표시하고 제1 그룹의 타이틀을 제1 GUI 아이템의 상단 또는 하단 중 적어도 하나에 표시하고 제2 그룹의 타이틀을 제2 GUI 아이템의 상단 또는 하단 중 적어도 하나에 표시하며, 리스트에 대한 스크롤 입력에 따라 제1 그룹 또는 제2 그룹 중 적어도 하나에 대응되는 리스트 길이가 변경되면, 변경된 리스트 길이에 기초하여 제1 그룹 또는 제2 그룹 중 하나 이상의 타이틀 길이를 변경하여 변경된 타이틀을 표시하도록 디스플레이를 제어할 수 있다.

Description

전자 장치 및 그 UI 제공 방법
본 개시는 전자 장치 및 그 UI 제공 방법에 관한 것으로, 더욱 상세하게는 복수의 GUI 아이템들을 포함하는 UI 화면을 제공하는 전자 장치 및 그 UI 제공 방법에 관한 것이다.
전자 기술의 발달에 힘입어 다양한 유형의 전자 장치가 개발되고 있다. 특히, 다양한 기능 및 새로운 경험을 원하는 사용자의 니즈(needs)에 부합하기 위하여 TV와 같은 디스플레이 장치는 다양한 컨텐츠를 제공하고 있다.
TV에서 제공되는 컨텐츠의 타입이 다양해지고 컨텐츠의 수가 점점 증가함에 따라 사용자가 원하는 컨텐츠를 탐색하기 위한 네비게이션 기능의 중요성이 증대되고 있다. 하지만 기존 디스플레이는 적절하거나 편리한 네비게이션 옵션을 제공하지 않고 있다.
본 개시의 하나 이상의 실시 예에 따른 전자 장치는, 디스플레이, 하나 이상의 명령어를 저장하는 메모리 및 상기 디스플레이 및 상기 메모리와 연결되어 상기 전자 장치를 제어하는 하나 이상의 프로세서를 포함할 수 있다. 상기 하나 이상의 프로세서는, 상기 하나 이상의 명령어를 실행함으로써, 상기 디스플레이 상에 (i) 하나 이상의 제1 GUI 아이템을 포함하는 제1 그룹 및 (ii) 하나 이상의 제2 GUI 아이템을 포함하는 제2 그룹으로 식별된 리스트를 표시하고, 상기 디스플레이 상에 상기 제1 그룹의 타이틀을 상기 제1 그룹의 상단 또는 하단 중 적어도 하나에 표시하고, 상기 디스플레이 상에 상기 제2 그룹의 타이틀을 상기 제2 그룹의 상단 또는 하단 중 적어도 하나에 표시하며, 상기 리스트에 대한 스크롤 입력에 따라 상기 제1 그룹 또는 상기 제2 그룹 중 적어도 하나에 대응되는 리스트 길이가 변경되면, 상기 변경된 리스트 길이에 기초하여 상기 제1 그룹 또는 상기 제2 그룹 중 하나 이상의 타이틀 길이를 변경하여 변경된 타이틀을 표시하도록 상기 디스플레이를 제어할 수 있다.
일 예에 따른 상기 하나 이상의 프로세서는, 상기 하나 이상의 명령어를 실행함으로써, 상기 리스트에 대한 스크롤 입력에 따라 상기 제1 그룹에 대응되는 리스트 길이가 변경되면, 상기 변경된 리스트 길이 이내에 상기 제1 그룹의 타이틀이 포함되도록 상기 제1 그룹의 타이틀 길이를 변경하여 변경된 타이틀을 표시하도록 상기 디스플레이를 제어할 수 있다.
일 예에 따른 상기 하나 이상의 프로세서는, 상기 하나 이상의 명령어를 실행함으로써, 상기 리스트에 포함된 GUI 아이템들이 일측으로 이동되어 상기 제1 그룹에 대응되는 리스트 길이가 변경되고 상기 제1 그룹의 타이틀의 길이 및 상기 변경된 제1 그룹의 리스트 길이 간 차이가 임계 길이 범위 내에 포함된 것으로 식별되면, 상기 변경된 제1 그룹의 리스트 길이 이내에 상기 제1 그룹의 타이틀이 포함되도록 상기 제1 그룹의 타이틀의 끝 부분을 줄임 처리할 수 있다.
일 예에 따른 상기 하나 이상의 프로세서는, 상기 하나 이상의 명령어를 실행함으로써, 역 스크롤 입력에 따라 상기 제1 그룹의 리스트 길이가 변경되고 상기 제1 그룹의 타이틀의 길이 및 상기 변경된 제1 그룹의 리스트 길이 간 차이가 상기 임계 길이 범위 내를 벗어난 것으로 식별되면, 상기 줄임 처리된 부분의 텍스트를 다시 표시하도록 상기 디스플레이를 제어할 수 있다.
일 예에 따른 상기 하나 이상의 프로세서는, 상기 하나 이상의 명령어를 실행함으로써, 상기 하나 이상의 제1 GUI 아이템 중 어느 하나에 이동형 포커스 아이템(focus item)을 표시하도록 상기 디스플레이를 제어하고, 상기 스크롤 입력에 따라 상기 이동형 포커스 아이템이 상기 하나 이상의 제1 GUI 아이템 중 다른 하나 또는 상기 하나 이상의 제2 GUI 아이템 중 어느 하나로 이동되어 상기 제1 그룹에 대응되는 리스트 길이가 변경되면, 상기 변경된 리스트 길이에 기초하여 상기 제1 그룹의 타이틀 길이를 변경하여 표시하도록 상기 디스플레이를 제어할 수 있다.
일 예에 따른 상기 하나 이상의 프로세서는, 상기 하나 이상의 명령어를 실행함으로써, 상기 하나 이상의 제1 GUI 아이템 중 하나에 고정형 포커스 아이템을 표시하도록 상기 디스플레이를 제어하고, 상기 스크롤 입력에 따라 상기 하나 이상의 제1 GUI 아이템 중 다른 하나가 상기 고정형 포커스 아이템 위치로 이동되어 상기 제1 그룹에 대응되는 리스트 길이가 변경되면, 상기 변경된 리스트 길이에 기초하여 상기 제1 그룹의 타이틀 길이를 변경하여 변경된 타이틀을 표시하도록 상기 디스플레이를 제어할 수 있다.
일 예에 따른 상기 하나 이상의 프로세서는, 상기 하나 이상의 명령어를 실행함으로써, 커서 아이템(cursor item)을 표시하도록 상기 디스플레이를 제어하고, 상기 포인터 아이템이 상기 하나 이상의 제1 GUI 아이템 중 어느 하나 상에 위치된 상태에서 상기 스크롤 입력에 따라 상기 제1 그룹에 대응되는 리스트 길이가 변경되면, 상기 변경된 리스트 길이에 기초하여 상기 제1 그룹의 타이틀 길이를 변경하여 변경된 타이틀을 표시하도록 상기 디스플레이를 제어할 수 있다.
일 예에 따른 상기 하나 이상의 프로세서는, 상기 하나 이상의 명령어를 실행함으로써, 상기 리스트에 대한 스크롤 입력에 따라 상기 제1 그룹에 대응되는 리스트 길이가 변경되면, 상기 변경된 리스트 길이 및 상기 제1 그룹의 타이틀 타입에 기초하여 상기 제1 그룹의 타이틀을 줄임 처리하여 표시하거나 제1 그룹의 타이틀을 요약 타이틀로 대체하여 표시하도록 상기 디스플레이를 제어할 수 있다.
일 예에 따른 상기 하나 이상의 프로세서는, 상기 하나 이상의 명령어를 실행함으로써, 좌측 방향 스크롤 입력에 따라 상기 제1 그룹에 대응되는 리스트 길이가 상기 제1 그룹의 타이틀 길이 미만으로 짧아지면 상기 제1 그룹의 타이틀에 포함된 복수의 워드 중 적어도 하나를 줄임 처리하여 표시하도록 상기 디스플레이를 제어하고, 우측 방향 스크롤 입력에 따라 상기 제2 그룹에 대응되는 리스트 길이가 상기 제2 그룹의 타이틀 길이 미만으로 짧아지면 상기 제2 그룹의 타이틀에 포함된 복수의 워드 중 적어도 하나를 줄임 처리하여 표시하도록 상기 디스플레이를 제어할 수 있다.
일 예에 따른 상기 하나 이상의 프로세서는, 상기 하나 이상의 명령어를 실행함으로써, 좌측 방향 스크롤 입력에 따라 상기 제1 그룹에 대응되는 리스트 길이가 상기 제1 그룹의 타이틀 길이 미만으로 짧아지면 상기 제1 그룹의 타이틀을 요약 타이틀로 대체하여 표시하도록 상기 디스플레이를 제어하고, 우측 방향 스크롤 입력에 따라 상기 제2 그룹에 대응되는 리스트 길이가 상기 제2 그룹의 타이틀 길이 미만으로 짧아지면 상기 제2 그룹의 타이틀을 요약 타이틀로 대체하여 표시하도록 상기 디스플레이를 제어할 수 있다.
하나 이상의 실시 예에 따른 전자 장치의 UI 제공 방법은, (i) 하나 이상의 제1 GUI 아이템을 포함하는 제1 그룹 및 (ii) 하나 이상의 제2 GUI 아이템을 포함하는 제2 그룹으로 식별된 리스트를 표시하고 상기 제1 그룹의 타이틀을 상기 제1 그룹의 상단 또는 하단 중 적어도 하나에 표시하고 상기 제2 그룹의 타이틀을 상기 제2 그룹의 상단 또는 하단 중 적어도 하나에 표시하는 단계 및, 상기 리스트에 대한 스크롤 입력에 따라 상기 제1 그룹 또는 상기 제2 그룹 중 적어도 하나에 대응되는 리스트 길이가 변경되면, 상기 변경된 리스트 길이에 기초하여 상기 제1 그룹 또는 상기 제2 그룹 중 하나 이상의 타이틀 길이를 변경하여 변경된 타이틀을 표시하는 단계를 포함할 수 있다.
하나 이상의 실시 예에 따른 전자 장치의 프로세서에 의해 실행되는 경우 상기 전자 장치가 동작을 수행하도록 하는 컴퓨터 명령을 저장하는 비일시적 컴퓨터 판독 가능 매체에 있어서, 상기 동작은, 하나 이상의 제1 GUI 아이템을 포함하는 제1 그룹 및 하나 이상의 제2 GUI 아이템을 포함하는 제2 그룹으로 식별된 리스트를 표시하고 상기 제1 그룹의 타이틀을 상기 제1 그룹의 상단 또는 하단 중 적어도 하나에 표시하고 상기 제2 그룹의 타이틀을 상기 제2 그룹의 상단 또는 하단 중 적어도 하나에 표시하는 단계 및, 상기 리스트에 대한 스크롤 입력에 따라 상기 제1 그룹 또는 상기 제2 그룹 중 적어도 하나에 대응되는 리스트 길이가 변경되면, 상기 변경된 리스트 길이에 기초하여 상기 제1 그룹 또는 상기 제2 그룹 중 하나 이상의 타이틀 길이를 변경하여 변경된 타이틀을 표시하는 단계를 포함할 수 있다.
본 개시의 특정 실시예의 상기 및 다른 측면, 특징 및 이점은 첨부된 도면과 함께 이루어진 다음의 설명으로부터 더욱 명백해질 것이다:
도 1은 본 개시의 하나 이상의 실시 예에 따른 전자 장치의 구현 예를 설명하기 위한 도면이다.
도 2a는 하나 이상의 실시 예에 따른 전자 장치의 구성을 나타내는 블럭도이다.
도 2b는 하나 이상의 실시 예에 따른 전자 장치의 구성을 구체적으로 나타내는 블럭도이다.
도 3은 하나 이상의 실시 예에 따른 UI 화면 제공 방법을 설명하기 위한 흐름도이다.
도 4는 도 3에 도시된 UI 화면 제공 방법을 자세히 설명하기 위한 흐름도이다.
도 5 및 도 6은 하나 이상의 실시 예에 따른 이동형 포커스 방식에 따른 UI 화면 제공 방법을 설명하기 위한 도면들이다.
도 7 및 도 8은 하나 이상의 실시 예에 따른 고정형 포커스 방식에 따른 UI 화면 제공 방법을 설명하기 위한 도면들이다.
도 9는 하나 이상의 실시 예에 따른 커서 이동 방식에 따른 UI 화면 제공 방법을 설명하기 위한 도면이다.
도 10은 하나 이상의 실시 예에 따른 터치 방식에 따른 UI 화면 제공 방법을 설명하기 위한 도면이다.
도 11은 하나 이상의 실시 예에 따른 역 스크롤 입력에 따른 UI 화면 제공 방법을 설명하기 위한 도면이다.
도 12는 하나 이상의 실시 예에 따른 스크롤 입력에 따른 UI 화면 제공 방법을 설명하기 위한 도면이다.
도 13은 하나 이상의 실시 예에 따른 스크롤 입력에 따른 UI 화면 제공 방법을 설명하기 위한 도면이다.
도 14, 도 15a 및 도 15b는 하나 이상의 실시 예에 따른 UI 화면 제공 방법을 하나 이상의 구현 예로 설명하기 위한 도면들이다.
본 명세서에서 사용되는 용어에 대해 간략히 설명하고, 본 개시에 대해 구체적으로 설명하기로 한다.
본 개시의 실시 예에서 사용되는 용어는 본 개시에서의 기능을 고려하면서 가능한 현재 널리 사용되는 일반적인 용어들을 선택하였으나, 이는 당 분야에 종사하는 기술자의 의도 또는 판례, 새로운 기술의 출현 등에 따라 달라질 수 있다. 또한, 특정한 경우는 출원인이 임의로 선정한 용어도 있으며, 이 경우 해당되는 개시의 설명 부분에서 상세히 그 의미를 기재할 것이다. 따라서 본 개시에서 사용되는 용어는 단순한 용어의 명칭이 아닌, 그 용어가 가지는 의미와 본 개시의 전반에 걸친 내용을 토대로 정의되어야 한다.
본 명세서에서, "가진다," "가질 수 있다," "포함한다," 또는 "포함할 수 있다" 등의 표현은 해당 특징(예: 수치, 기능, 동작, 또는 부품 등의 구성요소)의 존재를 가리키며, 추가적인 특징의 존재를 배제하지 않는다.
본 개시에서, "A 또는 B," "A 또는/및 B 중 적어도 하나," 또는 "A 또는/및 B 중 하나 또는 그 이상"등의 표현은 함께 나열된 항목들의 모든 가능한 조합을 포함할 수 있다. 예를 들면, "A 또는 B," "A 및 B 중 적어도 하나," 또는 "A 또는 B 중 적어도 하나"는, (1) A 만을 포함, (2) B 만을 포함, 또는 (3) A 및 B 를 포함하는 경우를 모두 지칭할 수 있다.
본 명세서에서 사용된 "제1," "제2," "첫째," 또는 "둘째,"등의 표현들은 다양한 구성요소들을, 순서 및/또는 중요도에 상관없이 수식할 수 있고, 한 구성요소를 다른 구성요소와 구분하기 위해 사용될 뿐 해당 구성요소들을 한정하지 않는다.
어떤 구성요소(예: 제1 구성요소)가 다른 구성요소(예: 제2 구성요소)에 "(기능적으로 또는 통신적으로) 연결되어(operatively or communicatively) coupled with/to)" 있다거나 "접속되어(connected to)" 있다고 언급된 때에는, 어떤 구성요소가 다른 구성요소에 직접적으로 연결되거나, 다른 구성요소(예: 제3 구성요소)를 통하여 연결될 수 있다고 이해되어야 할 것이다.
본 개시에서 사용된 표현 "~하도록 구성된(또는 설정된)(configured to)"은 상황에 따라, 예를 들면, "~에 적합한(suitable for)," "~하는 능력을 가지는(having the capacity to)," "~하도록 설계된(designed to)," "~하도록 변경된(adapted to)," "~하도록 만들어진(made to)," 또는 "~를 할 수 있는(capable of)"과 바꾸어 사용될 수 있다. 용어 "~하도록 구성된(또는 설정된)"은 하드웨어적으로 "특별히 설계된(specifically designed to)" 것만을 반드시 의미하지 않을 수 있다.
어떤 상황에서는, "~하도록 구성된 장치"라는 표현은, 그 장치가 다른 장치 또는 부품들과 함께 "~할 수 있는" 것을 의미할 수 있다. 예를 들면, 문구 "A, B, 및 C를 수행하도록 구성된(또는 설정된) 프로세서"는 해당 동작을 수행하기 위한 전용 프로세서(예: 임베디드 프로세서), 또는 메모리 장치에 저장된 하나 이상의 소프트웨어 프로그램들을 실행함으로써, 해당 동작들을 수행할 수 있는 범용 프로세서(generic-purpose processor)(예: CPU 또는 application processor)를 의미할 수 있다.
단수의 표현은 문맥상 명백하게 다르게 뜻하지 않는 한, 복수의 표현을 포함한다. 본 출원에서, "포함하다" 또는 "구성되다" 등의 용어는 명세서상에 기재된 특징, 숫자, 단계, 동작, 구성요소, 부품 또는 이들을 조합한 것이 존재함을 지정하려는 것이지, 하나 또는 그 이상의 다른 특징들이나 숫자, 단계, 동작, 구성요소, 부품 또는 이들을 조합한 것들의 존재 또는 부가 가능성을 미리 배제하지 않는 것으로 이해되어야 한다.
실시 예에 있어서 "모듈" 혹은 "부"는 적어도 하나의 기능이나 동작을 수행하며, 하드웨어 또는 소프트웨어로 구현되거나 하드웨어와 소프트웨어의 결합으로 구현될 수 있다. 또한, 복수의 "모듈" 혹은 복수의 "부"는 특정한 하드웨어로 구현될 필요가 있는 "모듈" 혹은 "부"를 제외하고는 적어도 하나의 모듈로 일체화되어 적어도 하나의 프로세서로 구현될 수 있다.
한편, 도면에서의 다양한 요소와 영역은 개략적으로 그려진 것이다. 따라서, 본 발명의 기술적 사상은 첨부한 도면에 그려진 상대적인 크기나 간격에 의해 제한되지 않는다.
이하 첨부된 도면들을 참조하여 본 개시의 하나 이상의 실시 예를 보다 상세하게 설명한다.
도 1은 본 개시의 하나 이상의 실시 예에 따른 전자 장치의 구현 예를 설명하기 위한 도면이다.
도 1에 따르면, 전자 장치(100)는 다양한 타입의 디스플레이 장치로 구현될 수 있다. 일 예에 따라 전자 장치(100)는 TV, 태블릿 PC, 이동 전화기, 데스크탑 PC, 랩탑 PC, PDA, PMP(portable multimedia player), LFD(large format display), Digital Signage(디지털 간판), DID(Digital Information Display), 비디오 월(video wall), 프로젝터, 냉장고, 에어컨, 공기 청정기, 의료 기기 또는 기존에 당업자에게 잘 알려진 디바이스 등과 같이 디스플레이 기능을 가지는 장치라면 한정되지 않고 적용 가능하다. 일 예에 따라 전자 장치(100)는 원격 제어 장치(미도시) 또는 원격 제어 어플리케이션을 실행하는 사용자 단말(미도시) 등과 같은 원격 제어 기능을 가지는 장치로부터 수신된 제어 신호에 기초하여 원격 제어될 수 있다. 다만, 전자 장치(100)는사용자의 입력, 예를 들어 사용자의 터치 입력에 의해 제어될 수 있음은 물론이다.
일 예에 따르면, 전자 장치(100)는 복수의 GUI(Graphic User Interface) 아이템을 포함하는 UI(User Interface) 화면을 제공하고 원격 제어 장치(미도시)로부터 수신된 네비게이션 입력에 기초하여 복수의 GUI 아이템 간의 네비게이션 동작을 제어할 수 있다.
하나 이상의 실시 예에 따르면, 전자 장치(100)는 다양한 크기 및/또는 다양한 비율을 가지는 복수의 GUI 아이템 및 이들 중 어느 하나의 GUI 아이템에 위치한 포커스 아이템을 포함하는 UI 화면을 제공할 수 있다. 이 경우, 전자 장치(100)는 원격 제어 장치로부터 수신된 스크롤(scroll) 입력에 기초하여 동일한 리스트 상에 배치된 복수의 GUI 아이템을 일 방향으로 이동시켜 표시할 수 있다.
일 예에 따르면, 도 1에 도시된 바와 같이 서로 다른 타입의 GUI 아이템이 각각 그룹핑되어, 즉 복수의 그룹에 대응되는 GUI 아이템들이 하나의 리스트 상에 제공될 수 있다. 이 경우, 각 그룹에 대응되는 그룹 타이틀이 각 그룹에 대응되는 리스트의 일 측에 제공될 수 있다. 예를 들어, "Accessories&Music" 그룹에 대응되는 GUI 아이템들 및 "Apps&Devices" 그룹에 대응되는 GUI 아이템들이 하나의 리스트(10) 상에 제공되고 각 그룹의 타이틀이 그룹 상단 좌측에 정렬되어 제공될 수 있다. 이 경우 해당 리스트(10) 상에서 스크롤 입력이 식별되면, 복수의 그룹 중 어느 하나의 그룹에 대응되는 리스트 길이가 그룹 타이틀보다 짧아져 복수의 그룹의 타이틀이 서로 충돌되어 표시되는 현상이 발생될 수 있다.
이에 따라 이하에서는 복수의 그룹을 포함하는 리스트에서 발생된 스크롤에 따라 각 그룹 리스트의 길이가 변경되면 그룹 타이틀의 길이를 함께 조정하여 UX 경험을 향상시킬 수 있는 다양한 실시 예에 대해 설명하도록 한다.
도 2a는 하나 이상의 실시 예에 따른 전자 장치의 구성을 나타내는 블럭도이다.
도 2a에 따르면 전자 장치(100)은 디스플레이(110), 메모리(120) 및 하나 이상의 프로세서(130)를 포함한다.
디스플레이(110)는 자발광 소자를 포함하는 디스플레이 또는, 비자발광 소자 및 백라이트를 포함하는 디스플레이로 구현될 수 있다. 예를 들어, LCD(Liquid Crystal Display), OLED(Organic Light Emitting Diodes) 디스플레이, LED(Light Emitting Diodes), 마이크로 LED(micro LED), Mini LED, PDP(Plasma Display Panel), QD(Quantum dot) 디스플레이, QLED(Quantum dot light-emitting diodes) 또는 당업자에게 알려진 다른 디스플레이 구조 등과 같은 다양한 형태의 디스플레이로 구현될 수 있다. 디스플레이(110) 내에는 a-si TFT, LTPS(low temperature poly silicon) TFT, OTFT(organic TFT) 등과 같은 형태로 구현될 수 있는 구동 회로, 백라이트 유닛 등도 함께 포함될 수 있다. 일 예에 따라 디스플레이(110)의 전면에는 터치 필름, 터치 시트, 터치 패드 또는 당업자에게 알려진 다른 터치 매커니즘 등의 형태를 가지고 터치(touch) 동작을 감지하는 터치 센서가 배치되어 다양한 유형의 터치 입력을 감지할 수 있도록 구현될 수 있다. 예를 들어, 디스플레이(110)는 사용자 손에 의한 터치 입력, 스타일러스 펜과 같은 입력 장치에 의한 터치 입력, 특정 정전 물질에 의한 터치 입력 등 다양한 유형의 터치 입력을 감지할 수 있다. 여기서, 입력 장치는 전자 펜, 스타일러스 펜, S-펜 등 다양한 용어로 지칭될 수 있는 펜 형의 입력 장치으로 구현될 수 있다. 일 예에 따라 디스플레이(110)는 평면(flat) 디스플레이, 커브드(curved) 디스플레이, 폴딩(folding) 또는/및 롤링(rolling) 가능한 플렉서블 디스플레이 또는 당업자에게 알려진 다른 디스플레이 구성 등으로 구현될 수 있다.
메모리(120)는 다양한 실시 예를 위해 필요한 데이터를 저장할 수 있다. 메모리(120)는 데이터 저장 용도에 따라 전자 장치(100')에 임베디드된 메모리 형태로 구현되거나, 전자 장치(100)에 탈부착이 가능한 메모리 형태로 구현될 수도 있다. 예를 들어,전자 장치(100)의 구동을 위한 데이터의 경우 전자 장치(100')에 임베디드된 메모리에 저장되고, 전자 장치(100)의 확장 기능을 위한 데이터의 경우 전자 장치(100)에 탈부착이 가능한 메모리에 저장될 수 있다. 한편, 전자 장치(100)에 임베디드된 메모리의 경우 휘발성 메모리(예: DRAM(dynamic RAM), SRAM(static RAM), 또는 SDRAM(synchronous dynamic RAM) 등), 비휘발성 메모리(non-volatile Memory)(예: OTPROM(one time programmable ROM), PROM(programmable ROM), EPROM(erasable and programmable ROM), EEPROM(electrically erasable and programmable ROM), mask ROM, flash ROM, 플래시 메모리(예: NAND flash 또는 NOR flash 등), 하드 드라이브, 또는 솔리드 스테이트 드라이브(solid state drive(SSD)) 중 적어도 하나로 구현될 수 있다. 또한, 전자 장치(100')에 탈부착이 가능한 메모리의 경우 메모리 카드(예를 들어, CF(compact flash), SD(secure digital), Micro-SD(micro secure digital), Mini-SD(mini secure digital), xD(extreme digital), MMC(multi-media card) 등), USB 포트에 연결가능한 외부 메모리(예를 들어, USB 메모리) 또는 당업자에게 알려진 다른 타입의 메모리 등과 같은 형태로 구현될 수 있다.
하나 이상의 프로세서(130)는 전자 장치(100)의 동작을 전반적으로 제어한다. 구체적으로, 하나 이상의 프로세서(130)는 전자 장치(100)의 각 구성과 연결되어 전자 장치(100)의 동작을 전반적으로 제어할 수 있다. 예를 들어, 하나 이상의 프로세서(130)는 디스플레이(110) 및 메모리(120)와 전기적으로 연결되어 전자 장치(100))의 전반적인 동작을 제어할 수 있다. 프로세서(130)는 하나 또는 복수의 프로세서로 구성될 수 있다.
하나 이상의 프로세서(130)는 메모리(120)에 저장된 하나 이상의 인스트럭션(instruction)을 실행함으로써, 다양한 실시 예에 따른 전자 장치(100)의 동작을 수행할 수 있다.
하나 이상의 프로세서(130)는 CPU (Central Processing Unit), GPU (Graphics Processing Unit), APU (Accelerated Processing Unit), MIC (Many Integrated Core), DSP (Digital Signal Processor), NPU (Neural Processing Unit), 하드웨어 가속기 또는 머신 러닝 가속기 중 하나 이상을 포함할 수 있다. 하나 이상의 프로세서(130)는 전자 장치의 다른 구성요소 중 하나 또는 임의의 조합을 제어할 수 있으며, 통신에 관한 동작 또는 데이터 처리를 수행할 수 있다. 하나 이상의 프로세서(130)는 메모리에 저장된 하나 이상의 프로그램 또는 명령어(instruction)을 실행할 수 있다. 예를 들어, 하나 이상의 프로세서는 메모리에 저장된 하나 이상의 명령어를 실행함으로써, 본 개시의 하나 이상의 실시 예에 따른 방법을 수행할 수 있다.
본 개시의 하나 이상의 실시 예에 따른 방법이 복수의 동작을 포함하는 경우, 복수의 동작은 하나의 프로세서에 의해 수행될 수도 있고, 복수의 프로세서에 의해 수행될 수도 있다. 예를 들어, 하나 이상의 실시 예에 따른 방법에 의해 제 1 동작, 제 2 동작, 제 3 동작이 수행될 때, 제 1 동작, 제 2 동작, 및 제 3 동작 모두 제 1 프로세서에 의해 수행될 수도 있고, 제 1 동작 및 제 2 동작은 제 1 프로세서(예를 들어, 범용 프로세서)에 의해 수행되고 제 3 동작은 제 2 프로세서(예를 들어, 인공지능 전용 프로세서)에 의해 수행될 수도 있다.
하나 이상의 프로세서(130)는 하나의 코어를 포함하는 단일 코어 프로세서(single core processor)로 구현될 수도 있고, 복수의 코어(예를 들어, 동종 멀티 코어 또는 이종 멀티 코어)를 포함하는 하나 이상의 멀티 코어 프로세서(multicore processor)로 구현될 수도 있다. 하나 이상의 프로세서(130)가 멀티 코어 프로세서로 구현되는 경우, 멀티 코어 프로세서에 포함된 복수의 코어 각각은 캐시 메모리, 온 칩(On-chip) 메모리와 같은 프로세서 내부 메모리를 포함할 수 있으며, 복수의 코어에 의해 공유되는 공통 캐시가 멀티 코어 프로세서에 포함될 수 있다. 또한, 멀티 코어 프로세서에 포함된 복수의 코어 각각(또는 복수의 코어 중 일부)은 독립적으로 본 개시의 하나 이상의 실시 예에 따른 방법을 구현하기 위한 프로그램 명령을 판독하여 수행할 수도 있고, 복수의 코어 전체(또는 일부)가 연계되어 본 개시의 하나 이상의 실시 예에 따른 방법을 구현하기 위한 프로그램 명령을 판독하여 수행할 수도 있다.
본 개시의 하나 이상의 실시 예에 따른 방법이 복수의 동작을 포함하는 경우, 복수의 동작은 멀티 코어 프로세서에 포함된 복수의 코어 중 하나의 코어에 의해 수행될 수도 있고, 복수의 코어에 의해 수행될 수도 있다. 예를 들어, 하나 이상의 실시 예에 따른 방법에 의해 제 1 동작, 제 2 동작, 및 제 3 동작이 수행될 때, 제 1 동작, 제2 동작, 및 제3 동작 모두 멀티 코어 프로세서에 포함된 제 1 코어에 의해 수행될 수도 있고, 제 1 동작 및 제 2 동작은 멀티 코어 프로세서에 포함된 제 1 코어에 의해 수행되고 제 3 동작은 멀티 코어 프로세서에 포함된 제 2 코어에 의해 수행될 수도 있다.
본 개시의 실시 예들에서, 프로세서는 하나 이상의 프로세서 및 기타 전자 부품들이 집적된 시스템 온 칩(SoC), 단일 코어 프로세서, 멀티 코어 프로세서, 또는 단일 코어 프로세서 또는 멀티 코어 프로세서에 포함된 코어를 의미할 수 있으며, 여기서 코어는 CPU, GPU, APU, MIC, DSP, NPU, 하드웨어 가속기 또는 기계 학습 가속기 등으로 구현될 수 있으나, 본 개시의 실시 예들이 이에 한정되는 것은 아니다. 이하에서는 설명의 편의를 위하여 하나 이상의 프로세서(130)를 프로세서(130)로 명명하도록 한다.
도 2b는 하나 이상의 실시 예에 따른 전자 장치의 구성을 구체적으로 나타내는 블럭도이다.
도 2b에 따르면, 전자 장치(100')은 디스플레이(110), 메모리(120), 하나 이상의 프로세서(130), 통신 인터페이스(140), 사용자 인터페이스(150), 스피커(160) 및 센서(170)를 포함할 수 있다. 도 2b에 도시된 구성 중 도 2a에 도시된 구성과 중복되는 구성에 대해서는 자세한 설명을 생략하도록 한다.
통신 인터페이스(140)는 전자 장치(100')의 구현 예에 따라 다양한 인터페이스로 구현될 수 있다. 예를 들어 통신 인터페이스(140)는 블루투스(Bluetooth), AP 기반의 Wi-Fi(와이파이, Wireless LAN 네트워크), 지그비(Zigbee), 유/무선 LAN(Local Area Network), WAN(Wide Area Network), 이더넷(Ethernet), IEEE 1394, HDMI(High-Definition Multimedia Interface), USB(Universal Serial Bus), MHL(Mobile High-Definition Link), AES/EBU(Audio Engineering Society/ European Broadcasting Union), 옵티컬(Optical), 코액셜(Coaxial) 또는 당업자에게 알려진 다른 통신 방식을 통해 외부 장치, 외부 저장 매체(예를 들어, USB 메모리), 외부 서버(예를 들어 웹 하드) 등과 통신을 수행할 수 있다. 일 예에 따라 통신 인터페이스(140)는 원격 제어 장치(미도시) 또는/및 원격 제어 기능을 가지는 사용자 단말(미도시)과 통신을 수행할 수 있다.
사용자 인터페이스(150)는 버튼, 터치 패드, 마우스 및 키보드와 같은 장치로 구현되거나, 상술한 디스플레이 기능 및 조작 입력 기능도 함께 수행 가능한 터치 스크린 등으로 구현될 수 있다.
스피커(160)는 각종 오디오 데이터뿐만 아니라 각종 알림 음이나 음성 메시지 등을 출력하는 구성일 수 있다. 프로세서(130)는 본 개시의 다양한 실시 예에 따른 UI 화면에 대응되는 정보 또는 각종 알림을 오디오 형태로 출력하도록 스피커를 제어할 수 있다.
센서(170)는 터치 센서, 근접 센서, 가속도 센서, 지자기 센서, 자이로 센서, 압력 센서, 위치 센서, 조도 센서 또는 당업자에게 알려진 다른 센서 등과 같은 다양한 유형의 센서를 포함할 수 있다.
그 밖에 전자 장치(100')는 구현 예에 따라 카메라, 마이크, 튜너 및 복조부 또는 당업자에게 알려진 다른 구성 을 포함할 수 있다.
카메라는 기 설정된 이벤트에 따라 턴 온 되어 촬영을 수행할 수 있다. 카메라는 촬상된 영상을 전기적인 신호로 변환하고 변환된 신호에 기초하여 영상 데이터를 생성할 수 있다. 예를 들어, 피사체는 반도체 광학소자(CCD; Charge Coupled Device)를 통해 전기적인 영상 신호로 변환되고, 이와 같이 변환된 영상 신호는 증폭 및 디지털 신호로 변환된 후 신호 처리될 수 있다.
마이크는 사용자 음성이나 기타 소리를 입력받아 오디오 데이터로 변환하기 위한 구성이다. 다만, 다른 실시 예에 따라 전자 장치(100')는 외부 장치를 통해 입력된 사용자 음성을 통신 인터페이스(140)를 통해 수신할 수 있다.
튜너는 안테나를 통해 수신되는 RF(Radio Frequency) 방송 신호 중 사용자에 의해 선택된 채널 또는 기 저장된 모든 채널을 튜닝하여 RF 방송 신호를 수신할 수 있다.
복조부는 튜너에서 변환된 디지털 IF 신호(DIF)를 수신하여 복조하고, 채널 복호화 등을 수행할 수도 있다.
일 예에 따라 프로세서(130)는 다양한 크기 및/또는 다양한 비율을 가지는 GUI 아이템들을 포함하는 UI 화면을 제공할 수 있다. 여기서, GUI 아이템은 이미지 컨텐츠, 동영상 컨텐츠, 어플리케이션, 광고 컨텐츠 등 다양한 타입의 컨텐츠에 대응되는 다양한 형태의 이미지 또는/및 텍스트를 포함할 수 있다. 예를 들어, GUI 아이템은 해당 컨텐츠를 대표하는 썸네일, 대표 이미지, 타이틀, 디스크립션 등일 수 있으나, 해당 컨텐츠를 식별할 수 있는 이미지 또는/및 텍스트를 포함할 수 있다.
일 예에 따라 프로세서(130)는 GUI 아이템들을 그룹핑하여 표시할 수 있다. 여기서, 그룹핑하여 표시한다 함은, 일 그룹에 포함된 GUI 아이템들이 다른 그룹에 포함된 GUI 아이템들과 구별되도록 상이한 영역에 표시되는 것을 의미할 수 있다. 또한, 프로세서(130)는 각 그룹의 상단 또는 하단 중 적어도 하나에 각 그룹의 타이틀을 표시할 수 있다. 일 예에 따라 프로세서(130)는 각 그룹의 상단에 좌측 정렬로 그룹 타이틀을 표시할 수 있으나, 반드시 이에 한정되는 것은 아니다. 예를 들어, 각 그룹의 하단에 좌측 정렬로 표시하거나, 각 그룹의 상단에 우측 정렬로 표시하는 것도 가능하다.
일 예에 따라 복수의 그룹이 하나의 리스트 상에 표시될 수 있다. 즉, 복수의 그룹 각각에 포함된 GUI 아이템들이 스크롤 입력에 연동되어 일 방향으로 이동 표시될 수 있다. 여기서, 스크롤이란 화면 상에 표시된 정보들이 상하 또는 좌우로 움직이는 것을 의미하며 화면에 표시된 정보의 양이 한 화면 분량을 넘으면 이미 화면에 표시된 정보 전체가 상하 또는 좌우로 움직일 수 있다. 스크롤 입력은 스크롤 현상을 발생시키는 다양한 사용자 명령을 포함할 수 있다.
도 3은 하나 이상의 실시 예에 따른 UI 화면 제공 방법을 설명하기 위한 흐름도이다.
도 3에 도시된 하나 이상의 실시 예에 따르면, 프로세서(130)는 하나 이상의 제1 GUI 아이템을 포함하는 제1 그룹 및 하나 이상의 제2 GUI 아이템을 포함하는 제2 그룹으로 식별된 리스트를 표시하도록 디스플레이(110)를 제어할 수 있다(S310). 또한, 프로세서(130)는 제1 그룹의 타이틀을 제1 그룹 아이템의 표시 영역의 상단 또는 하단 중 적어도 하나에 표시하고 제2 그룹의 타이틀을 제2 그룹 아이템의 표시 영역의 상단 또는 하단 중 적어도 하나에 표시할 수 있다(S320). 여기서, S310 단계 및 S320 단계는 설명의 편의를 위하여 개별적으로 기재하였지만 각 그룹의 GUI 아이템 및 그룹 타이틀이 동시에 표시됨은 물론이다. 예를 들어 도 1에 도시된 바와 같은 "Accessories&Music" 그룹에 대응되는 GUI 아이템들 및 "Apps&Devices" 그룹에 대응되는 GUI 아이템들을 포함하며, 각 그룹이 타이틀이 그룹 상단 좌측에 정렬된 형태의 리스트(10)를 표시할 수 있다.
프로세서(130)는 리스트에 대한 스크롤 입력이 식별되면(S330:Y), 제1 그룹 또는 제2 그룹 중 적어도 하나에 대응되는 리스트 길이가 변경되는지 식별할 수 있다(S340).
일 예에 따라 프로세서(130)는 제1 그룹 또는 제2 그룹 중 적어도 하나에 대응되는 리스트 길이의 변경 값이 임계 길이 이상인지 여부를 식별할 수 있다. 여기서, 임계 길이는 각 그룹에 대응되는 리스트 길이에 따라 상이하게 설정될 수 있다. 예를 들어, 임계 길이는 현재 화면 상에 표시된 각 그룹에 대응되는 리스트 길이에 따라 상이하게 결정될 수 있다. 또는, 프로세서(130)는 제1 그룹의 타이틀 길이(또는 제2 그룹의 타이틀 길이) 및 제1 그룹의 리스트 길이(또는 제2 그룹의 리스트 길이) 간 차이가 임계 길이 범위 이내인지 여부를 식별할 수 있다. 예를 들어, 임계 길이 범위는 기 설정된 값일 수 있으며 제1 그룹의 타이틀의 길이(또는 제2 그룹의 타이틀 길이) 및 변경된 제1 그룹의 리스트 길이(또는 제2 그룹의 리스트 길이)가 거의 유사해지는 값으로 결정될 수 있다.
프로세서(130)는 제1 그룹 또는 제2 그룹 중 적어도 하나에 대응되는 리스트 길이가 변경된 것으로 식별되면(S340:Y), 변경된 리스트 길이에 기초하여 제1 그룹 또는 제2 그룹 중 하나 이상의 타이틀 길이를 변경하여 표시하도록 디스플레이(110)를 제어할 수 있다(S350). 일 예에 따라 프로세서(130)는 제1 그룹 또는 제2 그룹 중 적어도 하나에 대응되는 리스트 길이의 변경 값이 임계 길이 이상이면 제1 그룹 또는 제2 그룹 중 하나 이상의 타이틀 길이를 변경하여 표시하도록 디스플레이(110)를 제어할 수 있다. 또는 프로세서(130)는 제1 그룹의 타이틀 길이(또는 제2 그룹의 타이틀 길이) 및 제1 그룹의 리스트 길이(또는 제2 그룹의 리스트 길이) 간 차이가 임계 길이 범위 이내이면 제1 그룹 또는 제2 그룹 중 하나 이상의 타이틀 길이를 변경하여 표시하도록 디스플레이(110)를 제어할 수 있다
일 예에 따라 프로세서(130)는 좌측 방향 스크롤 입력에 따라 제1 그룹에 대응되는 리스트 길이가 제1 그룹의 타이틀 길이 미만으로 짧아지면 제1 그룹의 타이틀 길이를 변경하여 표시하도록 디스플레이(110)를 제어할 수 있다. 또한, 프로세서(130)는 우측 방향 스크롤 입력에 따라 제2 그룹에 대응되는 리스트 길이가 제2 그룹의 타이틀 길이 미만으로 짧아지면 제2 그룹의 타이틀 길이를 변경하여 표시하도록 디스플레이(110)를 제어할 수 있다.
도 4는 도 3에 도시된 UI 화면 제공 방법을 자세히 설명하기 위한 흐름도이다.
도 4에 도시된 하나 이상의 실시 예에 따르면, 리스트에 대한 스크롤 입력에 따라(S410:Y), 리스트에 포함된 GUI 아이템들이 일측으로 이동되어 제1 그룹에 대응되는 리스트 길이가 변경될 수 있다(S420).
이 경우, 프로세서(130)는 제1 그룹의 타이틀의 길이 및 변경된 제1 그룹의 리스트 길이 간 차이가 임계 길이 범위 내에 포함되는지 식별할 수 있다(S430). 여기서, 임계 길이 범위는 기 설정된 값일 수 있으며 제1 그룹의 타이틀의 길이 및 변경된 제1 그룹의 리스트 길이가 거의 유사해지는 값으로 결정될 수 있다. 즉, 프로세서(130)는 제1 그룹의 타이틀의 길이 및 변경된 제1 그룹의 리스트 길이 간 차이가 약간의 여유 범위를 두고 유사해지는지 여부를 식별할 수 있다.
프로세서(130)는 제1 그룹의 타이틀의 길이 및 변경된 제1 그룹의 리스트 길이 간 차이가 임계 길이 범위 내에 포함되는 것으로 식별되면(S430:Y), 제1 그룹의 타이틀의 끝 부분을 줄임 처리(또는 생략 처리)할 수 있다(S440). 즉, 프로세서(130)는 제1 그룹의 타이틀의 끝 부분을 줄임 처리하여 변경된 제1 그룹의 리스트 길이 이내에 제1 그룹의 타이틀이 포함되도록 할 수 있다. 여기서, 줄임 처리란 "..."와 같은 줄임표를 이용한 처리를 포함할 수 있으나, 반드시 이에 한정되는 것은 아니며 나머지 부분이 줄임(또는 생략) 처리되었음을 나타내는 표시라면 한정되지 않고 적용 가능하다. 예를 들어, 도 1을 참조하면, "Accessories & Music" 그룹의 타이틀은 "Accessories & Mu…"로 줄임 처리될 수 있다.
이 후, 프로세서(130)는 제1 그룹의 타이틀의 끝 부분을 줄임 처리된 후, 역 스크롤 입력에 따라 제1 그룹의 리스트 길이가 변경되는지 식별할 수 있다(S450).
프로세서(130)는 역 스크롤 입력에 따라 제1 그룹의 타이틀의 길이 및 상기 변경된 제1 그룹의 리스트 길이 간 차이가 임계 길이 범위 내를 벗어난 것으로 식별되면(S460:Y), 줄임 처리된 부분에 대응되는 텍스트를 반복표시할 수 있다(S470). 예를 들어, , 프로세서(130)는 역 스크롤 입력에 따라 제1 그룹의 타이틀의 끝 부분 텍스트를 표시하기에 충분한 정도로 제1 그룹의 리스트 길이가 길어지면 줄임 처리된 부분에 대응되는 텍스트를 다시 표시할 수 있다.
다만, 이에 한정되는 것은 아니며 다른 예에 따라 프로세서(130)는 그룹 타이틀 줄임 처리가 필요한 경우 그룹 타이틀의 텍스트 타입에 기초하여 적절한 텍스트 부분을 줄임 처리할 수 있다. 일 예로, 그룹 타이틀이 하나의 워드를 포함하는 타입인 경우(예를 들어, Sonsored), 또는 연속된 복수의 워드를 포함하는 타입인 경우(예를 들어, Recently Played) 타이틀 끝 부분을 줄임 처리할 수 있다. 다른 예로, 그룹 타이틀이 복수의 워드가 &로 결합된 타입이고 앞쪽에 배치된 타이틀 워드의 길이가 상대적으로 긴 경우 앞쪽에 배치된 타이틀 워드를 줄임 처리할 수 있다. 이에 따라 사용자는 그룹 타이틀이 줄임 처리되더라도 복수의 워드 각각에 대해 적어도 일부분은 인식할 수 있게 된다.
다른 예에 따라 프로세서(130)는 그룹 타이틀 변경 처리가 필요한 경우 그룹 타이틀을 요약 텍스트로 대체하여 표시할 수 있다. 예를 들어, ..와 같은 줄임 처리가 아닌 요약된 워드로 그룹 타이틀을 대체 처리할 수 있다. 예를 들어 그룹 텍스트가 abc def ghi인 경우 ADG와 같은 요약 텍스트로 대체하거나, abc와 같은 요약 텍스트로 대체할 수 있다. 다만, 이는 일 예일 뿐이며 그룹 타이틀의 타입에 따라 요약 텍스트는 다양한 형태가 될 수 있다. 예를 들어, Recently Played 의 경우 "Recently P", 또는 "Recently"와 같이 사용자가 인식 가능한 요약 텍스트로 대체될 수 있다.
또 다른 예에 따라 프로세서(130)는 그룹 타이틀 변경 처리가 필요한 경우 그룹 타이틀의 텍스트 타입에 기초하여 적절한 텍스트 부분을 줄임 처리할지 요약 텍스트로 대체할지 식별할 수 있다. 예를 들어 줄임 처리 또는 요약 처리에 따른 사용자의 인식도에 기초하여 그룹 타이틀을 줄임 처리하거나 요약 텍스트로 대체할 수 있다. 인식도는 타이틀의 축약 버전이 인식될 가능성에 해당할 수 있다.
한편, 하나 이상의 실시 예에 따르면 스크롤 입력은 기 설정된 네비게이션 입력, 예를 들어, 원격 제어 장치(미도시)에 구비된 특정 버튼에 대한 누름 조작(예를 들어, 롱 프레스 입력), 터치 스크롤 조작, 스크롤 버튼 조작, 휠 입력 장치에서의 연속키 입력 등 전자 장치(100)의 구현 형태에 따라 다양한 형태로 입력될 수 있다. 또한, 리스트의 스크롤 제어 방식은 이동형 포커스 방식, 고정형 포커스 방식, 커서(또는 포인터) 이동 방식 등 다양한 타입을 포함할 수 있다. 이하에서는 다양한 타입의 스크롤 제어 방식에 대응되는 UI 화면 제공 방법에 대해 도면을 참조하여 설명하도록 한다.
도 5 및 도 6은 하나 이상의 실시 예에 따른 이동형 포커스 방식에 따른 UI 화면 제공 방법을 설명하기 위한 도면들이다.
도 5에 도시된 하나 이상의 실시 예에 따르면, 프로세서(130)는 제1 그룹에 포함된 하나 이상의 제1 GUI 아이템 중 어느 하나에 이동형 포커스 아이템(focus item)을 표시하도록 디스플레이(110)를 제어할 수 있다(S510). 이동형 포커스 아이템은 이동형 포커스 방식에 따라 리스트의 스크롤을 제어하기 위한 아이템으로, 스크롤 입력에 따라 이동형 포커스 아이템이 일 방향으로 이동되고 리스트에 포함된 GUI 아이템들은 반대 방향으로 이동될 수 있다.
일 예에 따라 GUI 아이템은 수평 방향, 수직 방향, 대각선 방향 또는 다른 적절한 방향으로 배열되며 특정 형상(예를 들어, 사각형, 둥근 사각형, 원형, 마름모 등)일 수 있다. 포커스 아이템는 GUI 아이템의 테두리에 하이라이트된 형태일 수 있으나, 반드시 이에 한정되는 것은 아니며 GUI 아이템 전체에 하이라이트되거나 일부 테두리에 하이라이트될 수도 있다.
한편, 리스트에 대한 스크롤 입력이 식별되면(S520:Y), 이동형 포커스 아이템이 제1 그룹에 포함된 하나 이상의 제1 GUI 아이템 중 다른 하나 또는 제2 그룹에 포함된 하나 이상의 제2 GUI 아이템 중 어느 하나로 이동되어 제1 그룹에 대응되는 리스트 길이가 변경될 수 있다(S530).
이 경우, 프로세서(130)는 제1 그룹의 타이틀 길이 및 변경된 리스트 길이 간 차이가 임계 길이 범위 내에 포함되는지 식별할 수 있다(S540).
프로세서(130)는 제1 그룹의 타이틀의 길이 및 변경된 제1 그룹의 리스트 길이 간 차이가 임계 길이 범위 내에 포함되는 것으로 식별(또는 판단)되면(S540:Y), 제1 그룹의 타이틀의 끝 부분을 줄임 처리(또는 생략 처리)할 수 있다(S550).
일 예에 따르면, 프로세서(130)는 도 6의 상측에 도시된 바와 같은 UI 화면(600)을 표시할 수 있다. UI 화면(600)은 다양한 메뉴 아이템(601, 602, 603, 604, 605) 및 복수의 GUI 아이템 리스트(610, 620, 630, 640)를 포함할 수 있다. 이 중 제1 그룹(Accessories&Music 그룹)에 포함된 GUI 아이템들(631, 632, 633) 및 제2 그룹(Apps&Devices 그룹)에 포함된 GUI 아이템들(634, 635, 636, 637, 638)은 하나의 리스트(630) 상에 제공될 수 있다. 일 예에 따라 제1 그룹(Accessories&Music 그룹)은 리스트(630) 내 좌측 영역에 표시되고 제2 그룹(Apps&Devices 그룹)은 리스트(630) 내 우측 영역에 표시될 수 있다. 리스트는 디스플레이의 동일한 행, 열 또는 타일에 포함된 아이템에 해당할 수 있다. 또한, 제1 그룹의 타이틀 즉, "Accessories&Music"은 제1 그룹의 상단에 좌측 정렬로 표시되고 제2 그룹의 타이틀 즉, "Apps&Devices"은 제2 그룹의 상단에 좌측 정렬로 표시될 수 있다. 또한, 제1 그룹(Accessories&Music 그룹)에 포함된 어느 하나의 GUI 아이템(633)에는 이동형 포커스 아이템(20)이 표시될 수 있다.
일 예에 따른 스크롤 입력에 따라 이동형 포커스 아이템(20)의 위치가 제2 그룹(Apps&Devices 그룹)에 포함된 GUI 아이템(634)로 이동되면서 리스트(630)에 포함된 GUI 아이템들이 좌측 방향으로 이동될 수 있다. 이 경우, 리스트(630) 상에서 맨 앞쪽에 위치한 GUI 아이템(631)은 화면 상에서 사라지면서 제1 그룹(Accessories&Music 그룹)에 대응되는 리스트 길이는 짧아지는 반면, 새로운 GUI 아이템(639)가 표시되면서 제2 그룹(Apps&Devices 그룹)에 대응되는 리스트 길이는 길어지게 된다.
이 경우, 프로세서(130)는 제1 그룹의 타이틀을 줄임 처리할 수 있다. 예를 들어, "Accessories&Music"의 끝 부분을 "Accessories..."와 같이 요약할 수 있다. 이에 따라 제1 그룹의 타이틀이 제2 그룹의 타이틀(즉, Apps&Devices)과 충돌되어 표시되지 않게 된다. 예를 들어, 제1 그룹의 타이틀이 제2 그룹의 타이틀과 오버랩되어 표시되는 것을 방지할 수 있게 된다.
도 7 및 도 8은 하나 이상의 실시 예에 따른 고정형 포커스 방식에 따른 UI 화면 제공 방법을 설명하기 위한 도면들이다.
도 7에 도시된 하나 이상의 실시 예에 따르면, 프로세서(130)는 제1 그룹에 포함된 하나 이상의 제1 GUI 아이템 중 어느 하나에 고정형 포커스 아이템을 표시하도록 디스플레이(110)를 제어할 수 있다. 고정형 포커스 아이템은 고정형 포커스 방식에 따라 리스트의 스크롤을 제어하기 위한 아이템으로, 스크롤 입력에 따라 고정형 포커스 아이템의 위치는 고정되고 리스트에 포함된 GUI 아이템들은 스크롤 방향으로 이동되고, UI 화면 상에 제공되지 않은 새로운 GUI 아이템이 UI 화면에 제공될 수 있다.
한편, 리스트에 대한 스크롤 입력이 식별(또는 결정)되면(S720:Y), 제1 그룹에 포함된 하나 이상의 제1 GUI 아이템 중 다른 하나가 고정형 포커스 아이템 위치로 이동되어 제1 그룹에 대응되는 리스트 길이가 변경될 수 있다(S730).
이 경우, 프로세서(130)는 제1 그룹의 타이틀 길이 및 변경된 리스트 길이 간 차이가 임계 길이 범위 내에 포함되는지 식별할 수 있다(S740).
프로세서(130)는 제1 그룹의 타이틀의 길이 및 변경된 제1 그룹의 리스트 길이 간 차이가 임계 길이 범위 내에 포함되는 것으로 식별되면(S740:Y), 제1 그룹의 타이틀의 끝 부분을 줄임 처리(또는 생략 처리)할 수 있다(S750).
일 예에 따르면, 프로세서(130)는 도 8의 상측에 도시된 바와 같은 UI 화면(600)을 표시할 수 있다. 도 8의 상측에 표시된 UI 화면의 구성은 도 6의 상측에 표시된 UI 화면의 구성과 유사하므로 중복되는 설명은 생략하도록 한다. 다만, 도 6과 달리 도 8에서는 제1 그룹의 GUI 아이템들(631, 632, 633) 및 제2 그룹의 GUI 아이템들(634, 635, 636, 637, 638)을 포함하는 리스트(630) 상에서 맨 앞쪽에 위치한 GUI 아이템(631) 상에 고정형 포커스 아이템(30)이 위치될 수 있다.
일 예에 따른 스크롤 입력에 따라 제1 그룹(Accessories&Music 그룹)에 속한 다른 GUI 아이템(632)이 고정형 포커스 아이템(30) 위치로 이동되면서 리스트(630)에 포함된 GUI 아이템들이 좌측 방향 또는 우측 방향으로 이동될 수 있다. 이 경우, 리스트(630) 상에서 맨 앞쪽에 위치한 GUI 아이템(631)은 화면 상에서 사라지면서 제1 그룹(Accessories&Music 그룹)에 대응되는 리스트 길이는 짧아지는 반면, 새로운 GUI 아이템(639)가 표시되면서 제2 그룹(Apps&Devices 그룹)에 대응되는 리스트 길이는 길어지게 된다. 이에 따라 제1 그룹(Accessories&Music 그룹)에 대응되는 타이틀 즉, "Accessories&Music"의 길이가 변경된 제1 그룹의 리스트 길이 미만으로 짧아질 수 있다.
이 경우, 프로세서(130)는 제1 그룹의 타이틀 즉, "Accessories&Music"의 끝 부분을 줄임 처리 즉, "Accessories..."와 같이 표시할 수 있다. 이에 따라 제1 그룹의 타이틀이 제2 그룹의 타이틀(즉, Apps&Devices)과 충돌되어 표시되지 않게 된다. 예를 들어, 제1 그룹의 타이틀이 제2 그룹의 타이틀과 오버랩되어 표시되는 것을 방지할 수 있게 된다.
도 9는 하나 이상의 실시 예에 따른 커서 이동 방식에 따른 UI 화면 제공 방법을 설명하기 위한 도면이다.
도 9에 도시된 하나 이상의 실시 예에 따르면, 프로세서(130)는 UI 화면(600) 상에 커서 아이템(40)을 제공할 수 있다. 여기서, 커서 아이템(40)은 도 9에 도시된 바와 같이 원격 제어 장치(910)에 의해 제어될 수 있으나 반드시 이에 한정되는 것은 아니다. 커서 아이템(40)의 제어 기능은 다양한 형태로 구현될 수 있으나, 설명의 편의를 위하여 커서 아이템(40)의 이동 방향 및 리스트의 이동 방향은 반대 방향인 것으로 상정하도록 한다. 즉, 커서 아이템(40)이 우측 방향으로 이동하면 리스트는 좌측 방향으로 이동하는 것으로 상정하도록 한다.
도 9에 도시된 일 예에 따르면, 커서 아이템(40)이 제1 그룹(Accessories&Music 그룹)에 포함된 GUI 아이템(633) 상에 위치된 상태에서 제2 그룹(Apps&Devices 그룹)에 포함된 GUI 아이템(634)로 우측 방향으로 이동되면서 리스트(630)에 포함된 GUI 아이템들이 좌측 방향으로 이동될 수 있다. 이 경우, 리스트(630) 상에서 맨 좌측(예를 들어 리스트의 시작)에 위치한 GUI 아이템(631)은 화면 상에서 사라지면서 제1 그룹(Accessories&Music 그룹)에 대응되는 리스트 길이는 짧아지는 반면, 새로운 GUI 아이템(639)가 표시되면서 제2 그룹(Apps&Devices 그룹)에 대응되는 리스트 길이는 길어지게 된다.
이 경우, 프로세서(130)는 제1 그룹의 타이틀을 줄임 처리할 수 있다. 예를 들어, "Accessories&Music"은"Accessories..."로 요약될 수 있다. 이에 따라 제1 그룹의 타이틀이 제2 그룹의 타이틀(즉, Apps&Devices)과 충돌되어 표시되지 않게 된다. 예를 들어, 제1 그룹의 타이틀이 제2 그룹의 타이틀과 오버랩되어 표시되는 것을 방지할 수 있게 된다.
도 10은 하나 이상의 실시 예에 따른 터치 방식에 따른 UI 화면 제공 방법을 설명하기 위한 도면이다.
도 10에 도시된 하나 이상의 실시 예에 따르면, UI 화면(600)은 터치 입력이 가능한 디스플레이 화면 상에 제공될 수 있다. 예를 들어, 태블릿과 같은 디스플레이 화면 상에 UI 화면(600)이 제공될 수 있다.
도 10에 도시된 일 예에 따르면, 제1 그룹(Accessories&Music 그룹)에 포함된 GUI 아이템(633) 상에 사용자의 손이 위치한 상태에서 좌측 방향의 터치 스크롤 입력이 식별되면, 리스트(630)에 포함된 GUI 아이템들이 좌측 방향으로 이동될 수 있다. 이 경우, 리스트(630) 상에서 맨 앞쪽에 위치한 GUI 아이템(631)은 화면 상에서 사라지면서 제1 그룹(Accessories&Music 그룹)에 대응되는 리스트 길이는 짧아지는 반면, 새로운 GUI 아이템(639)가 표시되면서 제2 그룹(Apps&Devices 그룹)에 대응되는 리스트 길이는 길어지게 된다.
이 경우, 프로세서(130)는 제1 그룹의 타이틀을 줄임 처리할 수 있다. 예를 들어, "Accessories&Music"는 "Accessories..."와 같이 요약될 수 있다. 이에 따라 제1 그룹의 타이틀이 제2 그룹의 타이틀(즉, Apps&Devices)과 충돌되어 표시되지 않게 된다. 예를 들어, 제1 그룹의 타이틀이 제2 그룹의 타이틀과 오버랩되어 표시되는 것을 방지할 수 있게 된다.
도 11은 하나 이상의 실시 예에 따른 역 스크롤 입력에 따른 UI 화면 제공 방법을 설명하기 위한 도면이다.
도 11의 상측 도면은 도 6의 하측 도면과 동일할 수 있다. 즉, 도 11의 상측 도면은 스크롤 입력에 따라 이동형 포커스 아이템(20)의 위치가 제2 그룹(Apps&Devices 그룹)에 포함된 GUI 아이템(634)로 이동되면서 리스트(630)에 포함된 GUI 아이템들이 좌측 방향으로 이동된 상태일 수 있다. 이에 따라 제1 그룹의 타이틀 즉, "Accessories&Music"의 끝 부분을 줄임 처리 즉, "Accessories..."와 같이 표시된 상태일 수 있다.
이 경우, 프로세서(130)는 이전 스크롤 방향과 반대 방향의 역 스크롤 입력에 따라 이동형 포커스 아이템(20)의 위치가 제2 그룹(Apps&Devices 그룹)에 포함된 GUI 아이템(634)에서 제1 그룹(Accessories&Music 그룹)에 포함된 GUI 아이템(633)으로 이동되면서 리스트(630)에 포함된 GUI 아이템들이 우측 방향으로 이동될 수 있다. 이 경우, 리스트(630) 상에서 맨 앞쪽에 위치한 GUI 아이템(631)이 다시 화면 상에 표시되면서 제1 그룹(Accessories&Music 그룹)에 대응되는 리스트 길이는 길어지는 반면, GUI 아이템(639)은 화면 상에서 사라지면서 제2 그룹(Apps&Devices 그룹)에 대응되는 리스트 길이는 짧아지게 된다.
이 경우, 프로세서(130)는 줄임 처리 되었던 제1 그룹의 타이틀을 원 상태로 복구시킬 수 있다. 즉, "Accessories..."와 같이 표시되었던 제1 그룹의 타이틀ㅇ에서 줄임 처리된 부분에 대응되는 텍스트를 다시 표시하여 "Accessories&Music"으로 표시할 수 있다.
도 12는 하나 이상의 실시 예에 따른 스크롤 입력에 따른 UI 화면 제공 방법을 설명하기 위한 도면이다.
도 12는 그룹 타이틀 줄임 처리의 다른 예시를 설명하기 위한 도면이다. 상술한 실시 예에서는 그룹 타이틀 줄임 처리가 필요한 경우 끝 부분을 줄임 처리하는 것으로 설명하였지만 반드시 이에 한정되는 것은 아니다.
일 예에 따라 도 12에 도시된 스크롤 상황에서 제1 그룹("Accessories&Music" 그룹)의 타이틀 줄임 처리가 필요한 경우 끝 부분이 아닌 중간 부분을 줄임 처리할 수 있다. 예를 들어, 제1 그룹의 타이틀 "Accessorie&Music"을 "Acce..&Music"와 같이 줄임 처리할 수 있다.
즉, 프로세서(130)는 스크롤 상황에서 그룹 타이틀 줄임 처리가 필요한 경우 그룹 타이틀의 텍스트 타입에 기초하여 적절한 텍스트 부분을 줄임 처리할 수 있다. 예를 들어, 그룹 타이틀이 도시된 바와 같이 복수의 워드가 &로 결합된 타입이고 앞쪽에 배치된 타이틀 워드의 길이가 워드 임계 값보다 긴 경우 앞쪽에 배치된 타이틀 워드를 줄임 처리할 수 있다. 이에 따라 사용자는 그룹 타이틀이 줄임 처리되더라도 복수의 워드 각각에 대해 적어도 일부분은 인식할 수 있게 된다.
도 13은 하나 이상의 실시 예에 따른 스크롤 입력에 따른 UI 화면 제공 방법을 설명하기 위한 도면이다.
도 13은 그룹 타이틀 변경 처리의 다른 예시를 설명하기 위한 도면이다. 상술한 실시 예에서는 그룹 타이틀 변경 처리가 필요한 경우 "..."과 같은 줄임표를 이용하는 것으로 설명하였으나, 이에 한정되는 것은 아니다.
프로세서(130)는 그룹 타이틀 변경 처리가 필요한 경우 그룹 타이틀을 요약 텍스트로 대체하여 표시할 수 있다.
일 예에 따라 도 13에 도시된 스크롤 상황에서 제1 그룹("Accessories&Music" 그룹)의 타이틀 변경 처리가 필요한 경우 해당 그룹 타이틀을 요약 타이틀로 대체하여 표시할 수 있다.
즉, 프로세서(130)는 스크롤 상황에서 그룹 타이틀 변경 처리가 필요한 경우 "..."와 같은 줄임 처리가 아닌 요약된 워드로 그룹 타이틀을 대체 처리할 수 있다. 예를 들어, 제1 그룹의 타이틀 "Accessorie&Music"을 "Acce&Music"와 같은 요약 텍스트로 대체하여 표시할 수 있다.
도 14, 도 15a 및 도 15b는 하나 이상의 실시 예에 따른 UI 화면 제공 방법을 일 구현 예로 설명하기 위한 도면들이다.
도 14에 따르면, 프로세서(130)는 리스크 스크롤이 발생되면(S1405), 그룹 리스트 길이(width) 및 그룹 타이틀 길이(width)를 비교할 수 있다(S1410).
프로세서(130)는 그룹 타이틀 길이가 그룹 리스트 길이와 비슷하거나 그룹 타이틀 길이가 그룹 리스트 길이보다 짧은지 식별할 수 있다(S1415). 여기서, 그룹 타이틀 길이가 그룹 리스트 길이와 비슷하다 함은 길이 차이가 임계 길이 범위 내에 포함됨을 의미할 수 있다.
프로세서(130)는 그룹 타이틀 길이가 그룹 리스트 길이와 비슷하면, 리스트 스크롤이 시작됨과 동시에 그룹 타이틀 끝을 줄임 처리할 수 있다(S1420). 예를 들어, 도 15a는 제1 GUI 아이템들(1511, 1512)를 포함하는 제1 그룹 및 제2 GUI 아이템들(1521, 1522)를 포함하는 제2 그룹이 하나의 리스트에 포함되고 제1 그룹의 타이틀 길이가 제1 그룹의 리스트 길이와 비슷한 예시를 도시한다. 이 경우, 프로세서(130)는 리스트 스크롤이 시작됨과 동시에 제1 그룹 타이틀 끝을 줄임 처리할 수 있다.
프로세서(130)는 그룹 타이틀 길이가 그룹 리스트 길이보다 짧으면, 리스트 이동이 시작되어도 그룹 타이틀을 유지하다가 그룹 타이틀 길이가 그룹 리스트 길이와 비슷해지는 순간부터 그룹 타이틀 끝을 줄임 처리할 수 있다(S1425). 예를 들어, 도 15b는 제1 GUI 아이템들(1511, 1512)를 포함하는 제1 그룹 및 제2 GUI 아이템들(1521, 1522)를 포함하는 제2 그룹이 하나의 리스트에 포함되고 제1 그룹의 타이틀 길이가 제1 그룹의 리스트 길이보다 짧은 예시를 도시한다. 이 경우, 프로세서(130)는 리스트 이동이 시작되어도 제1 그룹 타이틀을 유지하다가, 제1 그룹 타이틀 길이가 제1 그룹 리스트 길이와 비슷해지는 순간부터 제1 그룹 타이틀 끝을 줄임 처리할 수 있다.
프로세서(130)는 그룹 타이틀 길이가 그룹 리스트 길이보다 길면, 리스트 스크롤 시작 전부터 그룹 타이틀을 줄임 처리할 수 있다(S1430).
프로세서(130)는 상기와 같은 처리를 통해 스크롤에 의한 그룹 리스트 길이 변경시 그룹 타이들 길이도 대응되도록 변경할 수 있다(S1435).
또한, 프로세서(130)는 그룹 리스트가 스크롤되어 화면 밖으로 나갔는지 즉, 화면을 벗어났는지 식별(또는 판단)할 수 있다(S1440).
프로세서(130)는 그룹 리스트가 스크롤되어 화면 밖으로 나간 것으로 식별(또는 판단)되면(S1440:Y), 그룹 타이틀을 화면에서 숨길 수 있다(S1445). 즉 프로세서(130)는 그룹 타이틀을 화면에서 사라지도록 할 수 있다.
하나 이상의 예시에 따르면, 프로세서(130)는 그룹 리스트의 적어도 일부가 화면 내에 유지되고 있는 것으로 식별되면(S1440:N), 그룹 타이틀의 적어도 일부를 화면 내에 유지할 수 있다.
한편, 프로세서(130)는 그룹 타이틀을 화면에서 숨긴 이후, 화면을 벗어났던 그룹 리스트 중 적어도 일부가 다시 화면 내로 들어온 것으로 식별되면(S1445:Y), 그룹 타이틀의 적어도 일부를 다시 표시할 수 있다(S1460).
상술한 다양한 실시 예에 따르면, 하나의 리스트에 복수의 그룹의 GUI 아이템들이 제공되는 상황에서 스크롤에 따라 복수의 그룹 중 어느 하나의 그룹에 대응되는 리스트 길이가 그룹 타이틀보다 짧아져 복수의 그룹의 타이틀이 서로 충돌되어 표시되는 현상을 방지할 수 있게 된다. 이에 따라 UI 화면에 대한 사용자의 UX 경험이 향상될 수 있다.
한편, 상술한 본 개시의 다양한 실시 예들에 따른 방법들은, 기존 전자 장치에 설치 가능한 어플리케이션 형태로 구현될 수 있다. 또는 상술한 본 개시의 다양한 실시 예들에 따른 방법들은 딥 러닝 기반의 인공 신경망(또는 심층 인공 신경망) 즉, 학습 네트워크 모델을 이용하여 수행될 수 있다.
또한, 상술한 본 개시의 다양한 실시 예들에 따른 방법들은, 기존 전자 장치에 대한 소프트웨어 업그레이드, 또는 하드웨어 업그레이드 만으로도 구현될 수 있다.
또한, 상술한 본 개시의 다양한 실시 예들은 전자 장치에 구비된 임베디드 서버, 또는 전자 장치의 외부 서버를 통해 수행되는 것도 가능하다.
한편, 본 개시의 일시 예에 따르면, 이상에서 설명된 다양한 실시 예들은 기기(machine)(예: 컴퓨터)로 읽을 수 있는 저장 매체(machine-readable storage media)에 저장된 명령어를 포함하는 소프트웨어로 구현될 수 있다. 기기는, 저장 매체로부터 저장된 명령어를 호출하고, 호출된 명령어에 따라 동작이 가능한 장치로서, 개시된 실시 예들에 따른 전자 장치(예: 전자 장치(A))를 포함할 수 있다. 명령이 프로세서에 의해 실행될 경우, 프로세서가 직접, 또는 프로세서의 제어 하에 다른 구성요소들을 이용하여 명령에 해당하는 기능을 수행할 수 있다. 명령은 컴파일러 또는 인터프리터에 의해 생성 또는 실행되는 코드를 포함할 수 있다. 기기로 읽을 수 있는 저장 매체는, 비일시적(non-transitory) 저장매체의 형태로 제공될 수 있다. 여기서, '비일시적'은 저장매체가 신호(signal)를 포함하지 않으며 실재(tangible)한다는 것을 의미할 뿐 데이터가 저장매체에 반영구적 또는 임시적으로 저장됨을 구분하지 않는다.
또한, 본 개시의 하나 이상의 실시 예에 따르면, 이상에서 설명된 다양한 실시 예들에 따른 방법은 컴퓨터 프로그램 제품(computer program product)에 포함되어 제공될 수 있다. 컴퓨터 프로그램 제품은 상품으로서 판매자 및 구매자 간에 거래될 수 있다. 컴퓨터 프로그램 제품은 기기로 읽을 수 있는 저장 매체(예: compact disc read only memory (CD-ROM))의 형태로, 또는 어플리케이션 스토어(예: 플레이 스토어TM)를 통해 온라인으로 배포될 수 있다. 온라인 배포의 경우에, 컴퓨터 프로그램 제품의 적어도 일부는 제조사의 서버, 어플리케이션 스토어의 서버, 또는 중계 서버의 메모리와 같은 저장 매체에 적어도 일시 저장되거나, 임시적으로 생성될 수 있다.
또한, 상술한 다양한 실시 예들에 따른 구성 요소(예: 모듈 또는 프로그램) 각각은 단수 또는 복수의 개체로 구성될 수 있으며, 전술한 해당 서브 구성 요소들 중 일부 서브 구성 요소가 생략되거나, 또는 다른 서브 구성 요소가 다양한 실시 예에 더 포함될 수 있다. 대체적으로 또는 추가적으로, 일부 구성 요소들(예: 모듈 또는 프로그램)은 하나의 개체로 통합되어, 통합되기 이전의 각각의 해당 구성 요소에 의해 수행되는 기능을 동일 또는 유사하게 수행할 수 있다. 다양한 실시 예들에 따른, 모듈, 프로그램 또는 다른 구성 요소에 의해 수행되는 동작들은 순차적, 병렬적, 반복적 또는 휴리스틱하게 실행되거나, 적어도 일부 동작이 다른 순서로 실행되거나, 생략되거나, 또는 다른 동작이 추가될 수 있다.
이상에서는 본 개시의 바람직한 실시 예에 대하여 도시하고 설명하였지만, 본 개시는 상술한 특정의 실시 예에 한정되지 아니하며, 청구범위에서 청구하는 본 개시의 요지를 벗어남이 없이 당해 개시에 속하는 기술분야에서 통상의 지식을 가진 자에 의해 다양한 변형실시가 가능한 것은 물론이고, 이러한 변형실시들은 본 개시의 기술적 사상이나 전망으로부터 개별적으로 이해되어서는 안될 것이다.

Claims (15)

  1. 전자 장치에 있어서,
    디스플레이;
    하나 이상의 명령어를 저장하는 메모리; 및
    상기 디스플레이 및 상기 메모리와 연결되어 상기 전자 장치를 제어하는 하나 이상의 프로세서;를 포함하며,
    상기 하나 이상의 프로세서는,
    상기 하나 이상의 명령어를 실행함으로써,
    상기 디스플레이 상에 (i) 하나 이상의 제1 GUI 아이템을 포함하는 제1 그룹 및 (ii) 하나 이상의 제2 GUI 아이템을 포함하는 제2 그룹으로 식별된 리스트를 표시하고
    상기 디스플레이 상에 상기 제1 그룹의 타이틀을 상기 제1 GUI 아이템의 상단 또는 하단 중 적어도 하나에 표시하고,
    상기 디스플레이 상에 상기 제2 그룹의 타이틀을 상기 제2 GUI 아이템의 상단 또는 하단 중 적어도 하나에 표시하며,
    상기 리스트에 대한 스크롤 입력에 따라 상기 제1 그룹 또는 상기 제2 그룹 중 적어도 하나에 대응되는 리스트 길이가 변경되면, 상기 변경된 리스트 길이에 기초하여 상기 제1 그룹 또는 상기 제2 그룹 중 하나 이상의 타이틀 길이를 변경하여 변경된 타이틀을 표시하도록 상기 디스플레이를 제어하는, 전자 장치.
  2. 제1항에 있어서,
    상기 하나 이상의 프로세서는,
    상기 하나 이상의 명령어를 실행함으로써,
    상기 리스트에 대한 스크롤 입력에 따라 상기 제1 그룹에 대응되는 리스트 길이가 변경되면, 상기 변경된 리스트 길이 이내에 상기 제1 그룹의 타이틀이 포함되도록 상기 제1 그룹의 타이틀 길이를 변경하여 변경된 타이틀을 표시하도록 상기 디스플레이를 제어하는, 전자 장치.
  3. 제2항에 있어서,
    상기 하나 이상의 프로세서는,
    상기 하나 이상의 명령어를 실행함으로써,
    상기 리스트에 포함된 GUI 아이템들이 일측으로 이동되어 상기 제1 그룹에 대응되는 리스트 길이가 변경되고 상기 제1 그룹의 타이틀의 길이 및 상기 변경된 제1 그룹의 리스트 길이 간 차이가 임계 길이 범위 내에 포함된 것으로 식별되면, 상기 변경된 제1 그룹의 리스트 길이 이내에 상기 제1 그룹의 타이틀이 포함되도록 상기 제1 그룹의 타이틀의 끝 부분을 줄임 처리하는, 전자 장치.
  4. 제3항에 있어서,
    상기 하나 이상의 명령어를 실행함으로써,
    상기 하나 이상의 프로세서는,
    역 스크롤 입력에 따라 상기 제1 그룹의 리스트 길이가 변경되고 상기 제1 그룹의 타이틀의 길이 및 상기 변경된 제1 그룹의 리스트 길이 간 차이가 상기 임계 길이 범위 내를 벗어난 것으로 식별되면, 상기 줄임 처리된 부분의 텍스트를 다시 표시하도록 상기 디스플레이를 제어하는, 전자 장치.
  5. 제1항에 있어서,
    상기 하나 이상의 프로세서는,
    상기 하나 이상의 명령어를 실행함으로써,
    상기 하나 이상의 제1 GUI 아이템 중 하나에 이동형 포커스 아이템(focus item)을 표시하도록 상기 디스플레이를 제어하고,
    상기 스크롤 입력에 따라 상기 이동형 포커스 아이템이 상기 하나 이상의 제1 GUI 아이템 중 다른 하나 또는 상기 하나 이상의 제2 GUI 아이템 중 어느 하나로 이동되어 상기 제1 그룹에 대응되는 리스트 길이가 변경되면, 상기 변경된 리스트 길이에 기초하여 상기 제1 그룹의 타이틀 길이를 변경하여 변경된 타이틀을 표시하도록 상기 디스플레이를 제어하는, 전자 장치.
  6. 제1항에 있어서,
    상기 하나 이상의 프로세서는,
    상기 하나 이상의 명령어를 실행함으로써,
    상기 하나 이상의 제1 GUI 아이템 중 어느 하나에 고정형 포커스 아이템을 표시하도록 상기 디스플레이를 제어하고,
    상기 스크롤 입력에 따라 상기 하나 이상의 제1 GUI 아이템 중 다른 하나가 상기 고정형 포커스 아이템 위치로 이동되어 상기 제1 그룹에 대응되는 리스트 길이가 변경되면, 상기 변경된 리스트 길이에 기초하여 상기 제1 그룹의 타이틀 길이를 변경하여 변경된 타이틀을 표시하도록 상기 디스플레이를 제어하는, 전자 장치.
  7. 제1항에 있어서,
    상기 하나 이상의 프로세서는,
    상기 하나 이상의 명령어를 실행함으로써,
    커서 아이템(cursor item)을 표시하도록 상기 디스플레이를 제어하고,
    상기 포인터 아이템이 상기 하나 이상의 제1 GUI 아이템 중 어느 하나 상에 위치된 상태에서 상기 스크롤 입력에 따라 상기 제1 그룹에 대응되는 리스트 길이가 변경되면, 상기 변경된 리스트 길이에 기초하여 상기 제1 그룹의 타이틀 길이를 변경하여 표시하도록 상기 디스플레이를 제어하는, 전자 장치.
  8. 제1항에 있어서,
    상기 하나 이상의 프로세서는,
    상기 하나 이상의 명령어를 실행함으로써,
    상기 리스트에 대한 스크롤 입력에 따라 상기 제1 그룹에 대응되는 리스트 길이가 변경되면, 상기 변경된 리스트 길이 및 상기 제1 그룹의 타이틀 타입에 기초하여 상기 제1 그룹의 타이틀을 줄임 처리하여 표시하거나 제1 그룹의 타이틀을 요약 타이틀로 대체하여 표시하도록 상기 디스플레이를 제어하는, 전자 장치.
  9. 제1항에 있어서,
    상기 하나 이상의 프로세서는,
    상기 하나 이상의 명령어를 실행함으로써,
    좌측 방향 스크롤 입력에 따라 상기 제1 그룹에 대응되는 리스트 길이가 상기 제1 그룹의 타이틀 길이 미만으로 짧아지면 상기 제1 그룹의 타이틀에 포함된 복수의 워드 중 적어도 하나를 줄임 처리하여 표시하도록 상기 디스플레이를 제어하고,
    우측 방향 스크롤 입력에 따라 상기 제2 그룹에 대응되는 리스트 길이가 상기 제2 그룹의 타이틀 길이 미만으로 짧아지면 상기 제2 그룹의 타이틀에 포함된 복수의 워드 중 적어도 하나를 줄임 처리하여 표시하도록 상기 디스플레이를 제어하는, 전자 장치.
  10. 제1항에 있어서,
    상기 하나 이상의 프로세서는,
    상기 하나 이상의 명령어를 실행함으로써,
    좌측 방향 스크롤 입력에 따라 상기 제1 그룹에 대응되는 리스트 길이가 상기 제1 그룹의 타이틀 길이 미만으로 짧아지면 상기 제1 그룹의 타이틀을 요약 타이틀로 대체하여 표시하도록 상기 디스플레이를 제어하고,
    우측 방향 스크롤 입력에 따라 상기 제2 그룹에 대응되는 리스트 길이가 상기 제2 그룹의 타이틀 길이 미만으로 짧아지면 상기 제2 그룹의 타이틀을 요약 타이틀로 대체하여 표시하도록 상기 디스플레이를 제어하는, 전자 장치.
  11. 전자 장치의 UI 제공 방법에 있어서,
    (i) 하나 이상의 제1 GUI 아이템을 포함하는 제1 그룹 및 (ii) 하나 이상의 제2 GUI 아이템을 포함하는 제2 그룹으로 식별된 리스트를 표시하는 단계;
    상기 제1 그룹의 타이틀을 상기 제1 GUI 아이템의 상단 또는 하단 중 적어도 하나에 표시하는 단계;
    상기 제2 그룹의 타이틀을 상기 제2 GUI 아이템의 상단 또는 하단 중 적어도 하나에 표시하는 단계; 및
    상기 리스트에 대한 스크롤 입력에 따라 상기 제1 그룹 또는 상기 제2 그룹 중 적어도 하나에 대응되는 리스트 길이가 변경되면, 상기 변경된 리스트 길이에 기초하여 상기 제1 그룹 또는 상기 제2 그룹 중 하나 이상의 타이틀 길이를 변경하여 변경된 타이틀을 표시하는 단계;를 포함하는 UI 제공 방법.
  12. 제11항에 있어서,
    상기 하나 이상의 타이틀 길이를 변경하여 표시하는 단계는,
    상기 리스트에 대한 스크롤 입력에 따라 상기 제1 그룹에 대응되는 리스트 길이가 변경되면, 상기 변경된 리스트 길이 이내에 상기 제1 그룹의 타이틀이 포함되도록 상기 제1 그룹의 타이틀 길이를 변경하여 변경된 타이틀을 표시하는 단계;를 포함하는, UI 제공 방법.
  13. 제12항에 있어서,
    상기 하나 이상의 타이틀 길이를 변경하여 표시하는 단계는,
    상기 리스트에 포함된 GUI 아이템들이 일측으로 이동되어 상기 제1 그룹에 대응되는 리스트 길이가 변경되고 상기 제1 그룹의 타이틀의 길이 및 상기 변경된 제1 그룹의 리스트 길이 간 차이가 임계 길이 범위 내에 포함된 것으로 식별되면, 상기 변경된 제1 그룹의 리스트 길이 이내에 상기 제1 그룹의 타이틀이 포함되도록 상기 제1 그룹의 타이틀의 끝 부분을 줄임 처리하는 단계;를 포함하는, UI 제공 방법.
  14. 제13항에 있어서,
    역 스크롤 입력에 따라 상기 제1 그룹의 리스트 길이가 변경되고 상기 제1 그룹의 타이틀의 길이 및 상기 변경된 제1 그룹의 리스트 길이 간 차이가 상기 임계 길이 범위 내를 벗어난 것으로 식별되면, 상기 줄임 처리된 부분의 텍스트를 다시 표시하는 단계;를 더 포함하는, UI 제공 방법.
  15. 전자 장치의 프로세서에 의해 실행되는 경우 상기 전자 장치가 동작을 수행하도록 하는 컴퓨터 명령을 저장하는 비일시적 컴퓨터 판독 가능 매체에 있어서,
    상기 동작은,
    하나 이상의 제1 GUI 아이템을 포함하는 제1 그룹 및 하나 이상의 제2 GUI 아이템을 포함하는 제2 그룹으로 식별된 리스트를 표시하는 단계;
    상기 제1 그룹의 타이틀을 상기 제1 GUI 아이템의 상단 또는 하단 중 적어도 하나에 표시하는 단계;
    상기 제2 그룹의 타이틀을 상기 제2 GUI 아이템의 상단 또는 하단 중 적어도 하나에 표시하는 단계; 및
    상기 리스트에 대한 스크롤 입력에 따라 상기 제1 그룹 또는 상기 제2 그룹 중 적어도 하나에 대응되는 리스트 길이가 변경되면, 상기 변경된 리스트 길이에 기초하여 상기 제1 그룹 또는 상기 제2 그룹 중 하나 이상의 타이틀 길이를 변경하여 변경된 타이틀을 표시하는 단계;를 포함하는, 비일시적 컴퓨터 판독 가능 매체.
PCT/KR2023/009426 2022-10-11 2023-07-04 전자 장치 및 그 ui 제공 방법 WO2024080500A1 (ko)

Priority Applications (1)

Application Number Priority Date Filing Date Title
US18/241,692 US20240118789A1 (en) 2022-10-11 2023-09-01 Electronic apparatus and method for providing user interface thereof

Applications Claiming Priority (2)

Application Number Priority Date Filing Date Title
KR1020220129711A KR20240050032A (ko) 2022-10-11 2022-10-11 전자 장치 및 그 ui 제공 방법
KR10-2022-0129711 2022-10-11

Related Child Applications (1)

Application Number Title Priority Date Filing Date
US18/241,692 Continuation US20240118789A1 (en) 2022-10-11 2023-09-01 Electronic apparatus and method for providing user interface thereof

Publications (1)

Publication Number Publication Date
WO2024080500A1 true WO2024080500A1 (ko) 2024-04-18

Family

ID=90669394

Family Applications (1)

Application Number Title Priority Date Filing Date
PCT/KR2023/009426 WO2024080500A1 (ko) 2022-10-11 2023-07-04 전자 장치 및 그 ui 제공 방법

Country Status (2)

Country Link
KR (1) KR20240050032A (ko)
WO (1) WO2024080500A1 (ko)

Citations (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
KR20120021779A (ko) * 2010-08-17 2012-03-09 엘지전자 주식회사 이동 단말기 및 그 제어 방법
JP2012068702A (ja) * 2010-09-21 2012-04-05 Konica Minolta Business Technologies Inc 画像形成装置、表示方法、および表示プログラム
KR101812189B1 (ko) * 2010-10-12 2017-12-26 삼성전자주식회사 3차원 ｇｕｉ를 이용한 컨텐츠 리스트 디스플레이 방법 및 이를 적용한 3차원 디스플레이장치
KR20180132305A (ko) * 2017-06-02 2018-12-12 주식회사 엘지유플러스 방송 프로그램 정보 표시 방법 및 이를 수행하는 단말과 서버
KR102345992B1 (ko) * 2021-03-31 2022-01-03 쿠팡 주식회사 아이템 카테고리 네비게이팅 정보 제공 방법 및 전자 장치

Patent Citations (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
KR20120021779A (ko) * 2010-08-17 2012-03-09 엘지전자 주식회사 이동 단말기 및 그 제어 방법
JP2012068702A (ja) * 2010-09-21 2012-04-05 Konica Minolta Business Technologies Inc 画像形成装置、表示方法、および表示プログラム
KR101812189B1 (ko) * 2010-10-12 2017-12-26 삼성전자주식회사 3차원 ｇｕｉ를 이용한 컨텐츠 리스트 디스플레이 방법 및 이를 적용한 3차원 디스플레이장치
KR20180132305A (ko) * 2017-06-02 2018-12-12 주식회사 엘지유플러스 방송 프로그램 정보 표시 방법 및 이를 수행하는 단말과 서버
KR102345992B1 (ko) * 2021-03-31 2022-01-03 쿠팡 주식회사 아이템 카테고리 네비게이팅 정보 제공 방법 및 전자 장치

Also Published As

Publication number Publication date
KR20240050032A (ko) 2024-04-18

Similar Documents

Publication Publication Date Title
WO2017086652A1 (en) Electronic device having rollable display and method of controlling the same
WO2012128548A2 (en) Method and apparatus of managing items on clipboard of portable terminal
WO2013058539A1 (en) Method and apparatus for providing search function in touch-sensitive device
WO2016093506A1 (ko) 이동 단말기 및 그 제어 방법
WO2014046525A1 (en) Method and apparatus for providing multi-window in touch device
WO2014171580A1 (en) Digital device and method of controlling therefor
WO2014061886A1 (en) Display apparatus and method for inputting characters thereof
WO2015167158A1 (en) User terminal device, method for controlling user terminal device and multimedia system thereof
EP2517364A2 (en) Mobile device and related control method for external output depending on user interaction based on image sensing module
EP2917823A1 (en) Portable device and control method thereof
WO2019139270A1 (ko) 디스플레이 장치 및 이의 컨텐츠 제공 방법
WO2015072803A1 (ko) 단말기 및 단말기의 제어 방법
WO2021096110A1 (en) Display apparatus and control method thereof
WO2015064893A1 (en) Display apparatus and ui providing method thereof
WO2015005721A1 (en) Portable terminal and method for providing information using the same
EP3215915A1 (en) User terminal device and method for controlling user terminal device thereof
WO2015190781A1 (ko) 사용자 단말 및 이의 제어 방법, 그리고 멀티미디어 시스템
WO2020241975A1 (en) Electronic device and method for controlling the same
WO2017086689A1 (ko) 전자 장치 및 이의 제어 방법
WO2013022204A2 (en) System and method for inputting characters in touch-based electronic device
WO2014035123A1 (en) User terminal apparatus and contol method thereof
WO2024080500A1 (ko) 전자 장치 및 그 ui 제공 방법
WO2021040180A1 (ko) 디스플레이장치 및 그 제어방법
WO2019098534A1 (ko) 전자 장치 및 그 제어 방법
EP3465409A1 (en) Electronic apparatus and controlling method thereof