|
|
| (2 intermediate revisions by one other user not shown) |
| Line 1: |
Line 1: |
| In order to get convergence for Plasma, I think there should be an overview of what this entails.
| | #REDIRECT [https://hig.kde.org/introduction/convergence.html] |
| | |
| First off, I think we need to know what parts of Plasma are actually common to all devices. These are the components that will be needed on each type of device, albeit in different forms. I've described these components as abstract as possible so they can apply to all types of devices, but later on I'll give examples for each type of device which should make it more clear.
| |
| | |
| Then you need to know what exactly is important for each device type, which is mainly the screen size and input method, and see how it affects these components. This should provide a vision for each UX that allows it to be optimized for that device type.
| |
| | |
| == Common Components ==
| |
| * '''Workspace''': this is the top-level container of the workspace. It's usually called your desktop or your home screen or shell. It's the thing that shows your wallpaper and where you can put plasmoids.
| |
| ** '''Application Launcher''': this is a component where you can find an overview of your installed applications and start one.
| |
| ** '''Application Shortcuts''': this is a component that can provide quick access to a limited set of applications
| |
| ** '''Active Application Overview''': this is a component that provides an overview of the currently open applications. This is limited to applications that are being directly used by the user and does not include any background applications
| |
| ** '''Background Application Overview''': this is a component that provides an overview of the background applications that are running in the workspace. This is limited to the applications that are relevant to the user.
| |
| ** '''Application-Workspace Interaction''': this is the component used to display information about the active applications and it provides ways to change the way the application is running within the workspace (e.g. minimize, maximize, close)
| |
| * '''Application''': this is the top-level container of a single application. This would usually be called the application window, though it doesn't really have a name on mobile devices since the application is usually run full-screen there.
| |
| ** '''Application Menu''': this is the component that provides access to different parts of the application.
| |
| ** '''Application Content''': this is the component where the application shows its actual content. This will most likely be different for each application, though they should conform to the Applications HIG so they can be displayed correctly on each type of device.
| |
| These components are the ones that should be relevant for each UX (though you may want to revise and update this list until it is entirely correct, this is just a rough estimation). I did not include plasmoids here because the way that they look is dependent on their size and where they are placed (and probably many other things) but it should not depend on the device type. They are very important to achieving convergence though, since many of these components are actually implemented as plasmoids which allows them to change or be replaced when changing to another UX.
| |
| | |
| == Device Types ==
| |
| I've provided examples of how each UX is currently implemented, but some of it is just guesswork since I haven't used every type of workspace. Feel free to correct this where necessary.
| |
| | |
| === Desktop UX ===
| |
| '''''Screen size''''': Large<br />
| |
| '''''Input method''''': Keyboard/Mouse from close range.
| |
| | |
| '''''UX Vision''''': Since there is enough space, you can make all components directly accessible and allow multiple applications to be shown at once. Applications should be displayed in the traditional desktop style because this device has a traditional-style input method
| |
| | |
| Example of how this is done in the Plasma Desktop workspace
| |
| * '''Workspace''': has Virtual Desktops
| |
| ** '''Application Launcher''': Kickoff Menu in the taskbar
| |
| ** '''Application Shortcuts''': Applications can be dragged to the taskbar or pinned in the Active Application Overview
| |
| ** '''Active Application Overview''': Task Manager in the taskbar
| |
| ** '''Background Application Overview''': System Tray in the taskbar
| |
| ** '''Application-Workspace Interaction''': Window Decorations for each application
| |
| * '''Application''': is windowed
| |
| ** '''Application Menu''': shows all top-level menu items at once at the top of the application window
| |
| ** '''Application Content''': most applications are already optimized for this device type
| |
| | |
| === Netbook UX ===
| |
| '''''Screen size''''': Moderate<br />
| |
| '''''Input method''''': Keyboard/Mouse from close range
| |
| | |
| | |
| '''''UX Vision''''': Is similar to a traditional desktop but lacks screen space. You should hide as much as possible, aside from the Application Content, but components can be the same as for the Desktop UX
| |
| | |
| Example of how this is done in the Plasma Netbook workspace
| |
| * '''Workspace''': has Virtual Desktops
| |
| ** '''Application Launcher''': Kickoff Menu in the taskbar (taskbar is auto-hidden)
| |
| ** '''Application Shortcuts''': Applications can be dragged to the taskbar or pinned in the Active Application Overview (taskbar is auto-hidden)
| |
| ** '''Active Application Overview''': Task Manager in the taskbar (taskbar is auto-hidden)
| |
| ** '''Background Application Overview''': System Tray in the taskbar (taskbar is auto-hidden)
| |
| ** '''Application-Workspace Interaction''': available in a separate auto-hidden panel (or integrated in the taskbar?)
| |
| * '''Application''': always running fullscreen
| |
| ** '''Application Menu''': available in a separate auto-hidden panel (or integrated in the taskbar?)
| |
| ** '''Application Content''': most applications are already optimized for this device type
| |
|
| |
| === Tablet UX ===
| |
| '''''Screen size''''': Moderate<br />
| |
| '''''Input method''''': Touchscreen from close range
| |
| | |
| '''''UX Vision''''': There is not a lot of space so you want to hide as much as possible, aside from the Application Content, but components need to be large enough to be controlled by fingers (which are less precise than a mouse pointer).
| |
| | |
| Example of how this should be done in the Plasma Tablet workspace (though this doesn't exist yet, I think)
| |
| * '''Workspace''': has multiple home screens (similar to Virtual Desktops)
| |
| ** '''Application Launcher''': a launcher accessible from the home screen (not necessarily fullscreen)
| |
| ** '''Application Shortcuts''': the bottom bar on the home screen
| |
| ** '''Active Application Overview''': a fullscreen application switcher accessible from the button bar
| |
| ** '''Background Application Overview''': a minimal top bar that auto-hides
| |
| ** '''Application-Workspace Interaction''': only from the Active Application Overview (close only)
| |
| * '''Application''': always running fullscreen
| |
| ** '''Application Menu''': available from a single button within the Application Content, a component shown by swiping from the edge of the workspace or through a shortcut (e.g. long-press a button in the button bar)
| |
| ** '''Application Content''': needs to conform to the Applications HIG in order to display content in a way that's suitable for this device type
| |
| | |
| === Smartphone UX ===
| |
| '''''Screen size''''': Small<br />
| |
| '''''Input method''''': Touchscreen from close range
| |
| | |
| '''''UX Vision''''': There is not a lot of space so you want to hide as much as possible, aside from the Application Content, but components need to be large enough to be controlled by fingers (which are less precise than a mouse pointer). The main difference with the Tablet UX is that the Application Content will need to adapt to the smaller screen size (how exactly this is done should be provided in the Applications HIG).
| |
| | |
| Example of how this is done in the Plasma Mobile workspace
| |
| * '''Workspace''': has multiple home screens (similar to Virtual Desktops)
| |
| ** '''Application Launcher''': a fullscreen launcher accessible from the home screen
| |
| ** '''Application Shortcuts''': the bottom bar on the home screen
| |
| ** '''Active Application Overview''': a fullscreen application switcher accessible from the button bar
| |
| ** '''Background Application Overview''': a minimal top bar that auto-hides
| |
| ** '''Application-Workspace Interaction''': only from the Active Application Overview (close only)
| |
| * '''Application''': always running fullscreen
| |
| ** '''Application Menu''': available from a single button within the Application Content, a component shown by swiping from the edge of the workspace or through a shortcut (e.g. long-press a button in the button bar)
| |
| ** '''Application Content''': needs to conform to the Applications HIG in order to display content in a way that's suitable for this device type
| |
| | |
| === Smartwatch UX ===
| |
| '''''Screen size''''': Tiny<br />
| |
| '''''Input method''''': Touchscreen from close range
| |
| | |
| '''''UX Vision''''': There is a very limited amount of space, not even enough to always show all of the Application Content and components still need to be large enough to be controlled by fingers (which are less precise than a mouse pointer). This means that the smartwatch can not be used for Application Content, but is mostly intended for things like notifications.
| |
| | |
| Example of how this can be done in a Plasma Smartwatch workspace
| |
| * '''Workspace''': N/A
| |
| ** '''Application Launcher''': shown full-screen on the main screen, showing only compatible applications
| |
| ** '''Application Shortcuts''': N/A
| |
| ** '''Active Application Overview''': shown as separate screen aside from the main screen
| |
| ** '''Background Application Overview''': shown as a separate screen aside from the main screen
| |
| ** '''Application-Workspace Interaction''': only from the Active Application Overview (close only)
| |
| * '''Application''': N/A (except for compatible applications, shown full-screen)
| |
| ** '''Application Menu''': N/A
| |
| ** '''Application Content''': applications need to be made compatible explicitly since the screen isn't big enough to just show the Application Content.
| |
| | |
| === TV UX ===
| |
| '''''Screen size''''': Very Large<br />
| |
| '''''Input method''''': Remote control from moderate to long range
| |
| | |
| '''''UX Vision''''': The longer range requires the components to be large enough to be able to clearly distinguish them. This means that despite the large screen you can not put a lot of information on the screen. Since a remote control is used, you must make each component clearly visible and accessible. The main focus here should be the Application Content.
| |
| | |
| Example of how this is done in the Plasma Media Center workspace
| |
| * '''Workspace''': only 1 screen (no Virtual Desktops) which contains a full-screen menu
| |
| ** '''Application Launcher''': a full-screen launcher accessible from the workspace's main menu
| |
| ** '''Application Shortcuts''': provided through customization options of the workspace's main menu
| |
| ** '''Active Application Overview''': accessible through the workspace's main menu (or possibly a hidden component accessed by navigating to the edge of the workspace)
| |
| ** '''Background Application Overview''': accessible through the workspace's main menu (or possibly a hidden component accessed by navigating to the edge of the workspace)
| |
| ** '''Application-Workspace Interaction''': only from the Active Application Overview (close only)
| |
| * '''Application''': always running fullscreen
| |
| ** '''Application Menu''': accessible a hidden component accessed by navigating to the edge of the workspace (not the same edge as used by the active and background application overview)
| |
| ** '''Application Content''': needs to conform to the Applications HIG in order to display content in a way that's suitable for this device type
| |
| | |
| == Changing to another UX ==
| |
| | |
| When you change to another UX, the workspace configuration might need to change, specifically the amount of virtual desktops. The window manager may also need to change its standard behaviour to automatically open applications fullscreen and show its window decorations differently (I think this has already been done for the Netbook workspace). The rest is about changing the behaviour of the specific components, most of which can be implemented as plasmoids (and many of them already are). This allows convergence in the following ways (which I think has always been the plan already):
| |
| * The plasmoids adapt when the workspace is changed to another UX
| |
| * The plasmoids are replaced by an alternative that is more suitable for the UX to which you are changing
| |
| For example, when moving from a Desktop UX to a Tablet UX:
| |
| * your plasmoids for Active and Background Application Overview might be replaced with touch-friendly alternatives
| |
| * additional plasmoids for showing the Application Menu and Application Shortcuts might be activated
| |
| * the Application Launcher plasmoid could remain but it might have slightly bigger menu entries for touch-input
| |
| | |
| == Applications HIG ==
| |
| | |
| There is a big problem with achieving convergence because of the applications that are used. For proper convergence you need each application to change according the UX of the workspace. The only way of achieving this from Plasma's perspective is to provide guidelines about how developers should create their application interfaces so they can be shown correctly in each UX, i.e. an Applications HIG. This HIG should provide guidelines that allow an application to be created in such a way that its interface can be optimized for each UX.
| |
| | |
| From the many UX examples above, you can already find some requirements for this HIG:
| |
| * Applications should allow for traditional input (keyboard/mouse), touch-input and remote control input
| |
| * Applications should allow for both portrait and landscape modes
| |
| * The Application Menu may need to be accessible from within the application (e.g. a hamburger or three dots icon)
| |
| | |
| | |
| Of course there are many more details that need to be addressed before convergence is possible, but this should provide an overview where you can define where you want to go with each UX and how to make them compatible with one another to allow transitioning from one to another. There is already work being done in many aspects, but hopefully this overview can help guide that work.
| |
