Finished

Finished?

So my project for university has come to a conclusion, I have designed it’s basic layout including the Base Station, Browser and Files plus the toolbar etc that would be on top of all windows.

I have changed the way some common tasks are done to streamline the interface and quicken interactivity, including combining the Cut, Copy and Paste buttons and also combining the Minimise, Maximise and Fullscreen buttons.

The demo station is hardly fully functional or pretty (such as gold background on the Files window, instead of it being transparent). However this is a demo after all.

Yes the basic design is finished, but you could say this is only the beginning…



— William Cody Winter

Demo Video

Demo Video

Demo Pics

Demo Pics

Gold background would be non-existent/transparent in a final product.

Vector Files

Vector Mockups Of Files And Main GUI Bar

Here is a vector illustration of the main menu bar, found at the top of each window (except the web browser).

Same as above but showing a drop down menu.

Here is the Files window (like My Computer/Finder), tabs are found at the very top of the window. The smily face :) icons just represent miscellaneous files.

Colours are not final!


Copyright © 2012, William Cody Winter.

Vector Base Station

Vector Mockups Of The Base Station

Here are some mockups of the Base Station rendered in a vector application.
It shows the main Base Station screen, plus internet browser and options screens.
Please note that these horrible bright solid colours are not the final look.

The buttons on the web browser are; Back, Files (i.e My Computer/Finder) and eMail.

These images are only of the Base Station (inc. Web Browser) and does not show the main interface (i.e. Files)



Copyright © 2012, William Cody Winter.

Title

Title

The title of this GUI/project is not very important as it is mainly about new ways of interacting with things, however I am thinking of naming it the Colossus GUI or Colossus OS, after the name of the first ever electronic computer (Colossus Computer).

The Colossus Computer was the first electronic computer and was developed by Tommy Flowers for the UK government at the Post Office Research Station in 1943 (Mk II in 1944).
It was used to crack Nazi codes, by the end of the war 10 Colossus computers were in use.

Presentation

Presentation

I gave a presentation on this project today at the University.
All seemed to go well and received positive feedback at the end.

Base Station Designs

Design For The Initial Screen

The project is mainly about new ways of interacting with something and thinking about it, my designs lack anything much in the way of new OS interactions.

So I came up with these designs for what I call the “Base Station”, as soon as the OS boots you would be presented with the Base Station a GUI sliced into three main parts.

1. Files (access to “My Computer”)

2. Internet (access to the web browser and eMail)

3. System/Options (access to system preferences)

+ A log-off/shut-down button in the bottom right hand corner

Below the sketches for the Base Station and Options panel is a  possible web browser design,

a little to similar is Google Chrome?

My idea for the use of scroll-bars is similar is Mac OS X Lion, accept they are never ever seen.

So my only real concern is that the idea for the Base Station maybe too much like the Metro UI in Windows 8.

Please leave me a comment, letting me know if you think the design is too similar to Windows 8 Metro or if you think the web browser is too similar to Google Chrome.

Copyright © 2012, William Cody Winter.
Except Windows 8, Metro UI and Mac OS X Lion.

Major OS Interfaces

Major OS GUI Interface Designs Through History

Here is a list of some of the major designs and changes to Operating System GUIs over the years.


The first computer to use a GUI was the Xerox Alto in 1973:

The Xerox 8010 Star (1981, AKA Xerox Star, ViewPoint, GlobalView) was the first computer to refer to itself as a Fully Integrated Desktop Computer. This interface reminds me of what would later be the interface of Mac OS.

Apple Lisa Office System 1 (1983, AKA Lisa OS) was the forerunner to Mac OS. It was soon to be replaced by the Mac Operating System which was more affordable.

Visi On (1984) was the first GUI for the IBM PC and used a mouse, but only text instead of icons.

Mac System Software 1.0 (1984, AKA Mac OS) it was window based with icons, windows could be moved with the mouse and files and folders could be copied by dragging and dropping them.

Amiga Workbench 1.0 (1985) far ahead of it’s time it included colour graphics (black, white, blue and orange) and multi-state icons which could appear to be selected or unselected.

Windows 1.0 (1985) this was Microsoft’s first venture into to the realm of GUIs.

GEOS (1986) was originally create for the Commodore 64.

Windows 2.0 (1987) windows can now be maximised, Minimised and resized.

OS/2 1.0 (1988) only supported monochrome fixed icons.

NeXTSTEP (1989) created by Steve Jobs after he was fired from Apple, it had bigger (48x48) icons and more colours.

Windows 3 (1990) added higher resolutions and a unified style.

Mac OS System 7 (1991) the first Mac OS to support colours.

Windows 95 (1995) was a major redesign from the ground up to MS Windows and for the first time in Windows OS added a close button to each window and the now famous Windows Task Bar.

OS/2 Warp 4 (1996) for the first time in OS/2 it added the Shredder, similar to Windows’ Recycle Bin but it deleted the files completely as soon as you used it.

Mac OS System 8 (1997) used 256 colour icons by default and used what later became known pseudo-3D icons.

Windows 98 (1998) looks very similar to Win95 but GUI could use more than 256 colours.

KDE 1.0 (1998) an open-source GUI aimed mostly at Unix and Linux operating systems. It has a visual style very similar to Windows 95/98.

BeOS (1999) was developed with a goal of being a GUI with a clean and uncluttered design.

Gnome 1.0 (1999) another popular Linux GUI.

Mac OS X (2001) the Operating System that would revolutionise the computer experience. Icons would be a default of 128x128 with transparency and anti-aliasing. Steve Jobs said at its announcement “One of the design goals was when you saw it you wanted to lick it.”.

Windows XP (2001) the XP interface was Microsoft’s answer to the 2000 announcement of the OS X Aqua interface. XP’s interface was fully skinnable. However unlike the Mac OS X’s 128x128 icons XP’s icons were still only 48x48.

Windows Vista (2007) added a lot of 3D animations to the interface, plus a new shiny glass theme called Aero.

Mac OS X 10.5 (2007, AKA Leopard) changed the Dock to a new 3D look and made the system Menu Bar transparent.

Gnome 2.24 (2008) now uses a more Mac like design.

KDE 4 (2008) added adjustable icon sizes, desktop widgets and a new theme.

Mac OS X 10.7 (2011, AKA Lion) Lion made two main new changes to the interface’s design. It added a full-screen button to the top right of every window with full-screen support and also made scroll-bars transparent. The new scroll-bars are also invisible unless being used or you hover over them.

References:

Gyorgy Fekete. (2009). Operating System Interface Design Between 1981-2009. Available: http://www.webdesignerdepot.com/2009/03/operating-system-interface-design-between-1981-2009/. Last accessed 23 Apr 2012.

N/A. (N/A). Aqua (user interface). Available: http://en.wikipedia.org/wiki/Aqua_(user_interface). Last accessed 23 Apr 2012.

Initial OS Interface Concepts

Here is the initial concepts for the OS interface design.

Below demonstrates the top of each application window, at the very top is the context sensitive menu which acts in much the same way as the Menu Bar in OS X, but is attached to each window instead of always being at the top of the screen. This menu bar also contains a clock in the centre and a log drop-down on the right which gives you the choice of logging-out, switching user or shutting down.

Below the menu bar is where you can find Close, Maximise etc buttons, These are centred instead of being left or right aligned like in some other Operating Systems.

Also to reduce the number of buttons on screen at any one time the Maximise, Minimise and Full-Screen options are combined under one drop-down.

However incase some people find this extra click to pull down the drop-down menu too time consuming, then one short-cut is to double click the area around those buttons to minimise the window.

You could also double click the drop-down menu to maximise the window.

Below shows a concept for a My Computer/Finder window, demonstrating tabs and a drop-down for Cut, Copy and Paste.

Copyright © 2012, William Cody Winter.

Welcome

Welcome to my online journal for the Interaction (Digital Artefact) project I’m doing, on the BA (Hons) Games Development course at the University of West London.


We are required to design a new way of interacting with something, like a website or game etc.
The two ideas I came up with were either a new Operating System interface, a new interface or way of interacting with a Full Motion Video (FMV) game, like the old Tex Murphy games.


I have chosen to (at least initially) focus my designing and research on Operating System interfaces.