Tag Archive for 'GUI'

The Next Generation GUI (Part II)

NGGUI MENU

NGGUI Coverflow NGGUI Tree

These are my first efforts at designing the Next Generation of GUI (NGGUI). This GUI is based of the 9 rules from Part I of the NGGUI. The mockups above are structural design guides, and in no way display the final polished look of the GUI, part of the reason is that the GUI is going to have themes, therefore their isn’t much point in spending time making it look pretty at this stage.

Menu

The round circles/icons at the bottom of the screen are 2D in design. When not using them, they turn left or right in unison disapearing. Some of the icons will be mandatory, but others will be optional, allowing you to choose what the icon is used for. TheTool Bar icon is mandatory, requiring all applications to use this area for any functions performed external to the active window.

The Multiview icon allows you to see your data represented in five different ways, 1) Coverflow (seen in the mockup above), 2) Tree (also seen in the mockup above), 3) Tag Cloud (No mockup, but google to get an idea), 4) Date/Calendar ( Similar to Sony Picture Motion Browser), and 5) Database (This pro level view allows you to manipulate the data, and can be thought of as an advanced version of Windows Explorer).

Tabs

Tabs are active for each application, allowing multiple windows. The Tabs convert to Categories when using Multiview.

Navigation

As discussed in a previous post, we are supplying multiple ways of searching and viewing data, which can be tailored to an individual based on their understanding of data relationships. Below is an example Ribbon Navigation, which can be tailored to individuals.
navigation

Three ribbons run across the top of the screen. Ribbon 1 (top) is an infinity Ribbon displaying all your installed applications. Your favourites are displayed first, then alphabetically. Ribbon 2 (middle) is the Category, for example by Genre, playlist, date, type, usage etc. Ribbon 3 (bottom) is the multiview, as dicussed above. All ribbons are theoretically infinite.

Next Generation GUI Universe (PART III)



The Next Generation GUI

Leading on from a previous post of mine (http://www.mollerade.com/2007/01/22/itunes-8/) i’m going to be spending some more time with iTunes 8 mock up development.Music Management is data management, so what ever user interface we come up with for iTunes 8, i would like us to make sure it is capable of handling any type of data, not just music, and audio. I believe we are past the point of needing seperate applications to manage and sort through various categories of data. Yes i want to be able to choose a cateogry of data i’m looking for, but i don’t want to jump from one application to do so. If i can make a playlist of my favourite songs, why can’t i do the same for my pictures, spreadsheet or any other document? I’m searching for an imersive environment that categorizes data in a multitude of ways, whilst displaying it to us in the most simple and visually appealing way possible. I want advanced features, but i don’t want to see them clutter the interface unless i need them. With that view perhaps this new iTunes 8 mock up shouldn’t be called iTunes at all, but a Next Gen Graphical User Interface (NGGUI) mock up.Over the next few weeks, i will attempt to design the building blocks of the NGGUI. Your feedback will be appreciated, so please come back and comment on the developments.Initial thoughts are as follows;

1) All open applications must be visible at the touch of a button.

2) Entertainment applications like Music and Video must by preference be able to sync with each other, eg, music stops playing when you start video, visa versa.

3) Pausing Audio, Video, presentations, slideshows, turning on and off screen should be possible by a single key, further functionality like skip, fast forward, stop should be possible by movement commands. (Intergrate Wii functionality).

4) Clutter free. Only see what you need enviroment, advanced functionality is possible, but not by default.

5) Enhanced functionality by installing function widgets. A function widget is capable of giving you additional functionality that would normally be a laborious manual task. (actually a good way of making money - give the application away for free and sell function widgets, allows everyone to benefit as the basic platform would concentrate on being secure and stable rather than adding functionality tools which would be driven by demand).

6) Easy Themes. What ever the design, a widget should be capable of changing any aspect of it.

7) Access to the database. I’m talking about creating a NGGUI that is being fed by a database. Give the user access to the database, so they can manipulate their data at source if they wish too.

8) Available online. Easy VPN access through a central online portal to your desktop.

9) multi views of data. Give users the ability to see their data represented graphically by various categories, which display the connections between the data, alla 7 degrees of seperation.

Right now its off to the drawing board to do some mock ups. *Update - The First Mockups have been completed and are available here.