Navigation of the FUCHAAAH!

Today's studio really made me think about how I actually want my program to function. Drawing up a draft wire-frame for my interface options put my ideas into words and gave me scope on how much I have to work with; the complexity of the search options, the level of customisation of the program's performance, additional features of the program. I also used the studio to solidify the system on which my program will run, which was necessary for me to progress any further with interface designs.

These are the four main ideas I had for operating systems. I admit they got a bit space-age by the end. The Smartphone interface would work on any device that has a built in camera but the lower-tech devices would not have access to all the functions. The wristband projected screen would effectively work like a touchscreen as far as physically interacting with it goes. The other two would require verbal command to interact with because there would be no clear way of using your hands to select what you want. Because of this there would have to be a list of key words that have definitive effects that must also be chosen in a way that each word represents its function logically and intuitively.

Blogging Blitz

Yet another blast of imagery I've found. I feel a bit like Dora calling up all these different maps. Maybe my interface should sing to the user...?

The use of colour is very well done in our friendly neighbourhood Kelburn Campus Map. The range of colours providing information is quite large but none are too obtrusive or dominating, creating an interesting but informative map. Kudos to VUWSA.

I was looking for those Fire Emergency Maps that have the flashing lights where the fire is but on account of the office never being open when I'm around I couldn't. I did manage to stumble across this image however which, ignoring the horrible glare, shows an interesting concept. The semi-3D view of the floor plan makes the bird's eye view less detached as it provides a view of the building we would be more familiar with. It is a small difference but an effective one. If the room is on a higher level perhaps convenient stairwells could be highlighted?

These are some conceptual sketches I whipped up based on my research so far on what my interface menu might actually look like. The top left drawing is based off signposts and the various options would pop in from the edges of the screen on little 'signs'.
The top right is a button map built up of simple an unobtrusive shapes. Throughout the interface these buttons would be available but subtle enough not to interfere with what's on-screen.
The bottom left is a bit more abstract. The shapes would shift and change in size as the user touches them, the selected ones becoming the largest. They would orbit around the centre when dormant. This is definitely the most futuristic looking menu.
The bottom right menu is far more basic, based on a cityscape silhouette. A ring of triangles would circle the selected spire that hold the different options (the titles in the sketch are merely example. I have yet to decide what options are actually available to users).
I expect once I nail down the details of what happens within my application I'll get a more solid idea on how to arrange it on-screen.

Circles Are Cool

It's pretty much a fact of life. The sky is blue, cows say moo and circles are cool. Curves just make things flow better because they don't mess around with any of this 'corners' nonsense. And so I found so pictures of already existing interfaces that revolve around circles to get some more ideas on layout and shape;

Whatever is going on here it looks cool. Why? Because it's composed of circles. Circles within circles!

I like the layout of this one for something like a primary menu, with smaller transparent tabs or buttons to select. The brightness of the centre draws focus to it as it uses the brightest colours (tinted white) but it is also the most solid part of the menu.

This shows how something like buttons could be used in tandem with a rotating slider or something. The wider the range of movements used in the interaction, the more interesting the user's experience will be.

There's something about the simplicity of this one that I like. Perhaps the drop-down menus could be attributed to different colours that become more dominant when selected.

I like the idea of using a trail of footprints as a loading bar. So here are some pictures of icon prints, however, I don't think a trail of kisses would be appropriate.

I also started looking into colour schemes as well. Considering it's a navigation system we're designing for it is expected that at some point the user will be outside so a 'natural' colour scheme could look rather cool. The second image shows how brighter, but still natural colours could be used.

And considering it's Victoria University a cityscape colour scheme would also be appropriate. Looking at some picture of cities they tend to be somewhat grey. The odd blue highlight could spice things up a little bit though.

The Face of Interaction

As much as I would like to continue spending my time watching TV series and wasting my time on Youtube, I figured it was time I did some actual work. I looked into navigational systems and the actual navigation of , those systems to get a scope on how interfaces work. The first and most obvious place to start was with GPS interfaces;

Simple, clean, easy to follow. I like the checked flag representing the destination as it adds character. The icons that show points of interest is a good idea as well. Perhaps a system that recognises particular shops and such and is able to provide detail on them.

Not quite as interesting as the one before, nor as easy to understand. On a basic level it provides all the information it really needs to but it could be improved in many areas.

Provides quite a shallow view of the surroundings but gives the user a better representation of what they might actually be seeing with the 3D buildings. Perhaps a zoom option that allows swapping between an overhead view and this one?

I don't like this one much at all. It is hard to follow with the use of different colours for roads without a key. At a glance I'm not too sure what direction it's pointing me in which is something a gps needs to do. If you're driving you don't have time to study a map.
Now to look at interfaces from an interactive point of view. An interface doesn't just have to be functional, it can look cool and be fun to interact with too.

The i-phone fully utilized the touch screen in having an interface that had users playing with the screen with their fingers in different ways. This made the interface fun to interact with but it was logical too; stroke this way and the screen moves that way.

The consistency of style in this interface connects all the screens together, despite the significant difference in layout of each. This is achieved by the colour scheme and transparency of the icons and the background imagery.

Although this particular interface is a bit busy the colour scheme works rather well. The balance of colour is well done to show importance and to link everything on-screen.

All the interfaces so far have been rigidly structured but this one shows how it can be achieved with a more chaotic arrangement and still work. The transparency is key in allowing so many things on-screen in this manner, otherwise icons would be lost.

First Steps

Yesterday we did an exercise to explore how many ways there are to direct someone to a specific location. We had written instructions, navigational drawings and maps, all trying to accomplish the same thing. The written instructions were easy enough to follow if they were well written but gave the least reassurance if you were on the right track or not. The other two types were visually based and harder to interpret but once we understood what was going on they made it easy to establish if we were in the correct area as we could visually compare our surrounding to the drawing.
Combining these ideas was the process we used to begin brainstorming for our navigation system. It sparked different ideas, like a system that recognises landmarks and generates directions accordingly, or having a camera-based interface that applies its instructions to what is visible through the camera.

Structure and Noise

This project is the exploration of structure and noise, and where the two collide. We set out to explore the concepts of both structure and noise and at what point they merge from one to the other. I wanted my form to degrade from an obvious structure to noise but having a set of controls that makes the change a type of 'ordered chaos'. Although the shards of the initial web are expanding and warping on their own accord, they are forced to the centre of the screen to fill the originally gaping hole. My project was successful in that looking at the final frame without seeing the others, it's difficult, if not impossible, to find any order at all.

Final Form

Having refined the code to my structured form it was time to mess with it. I found through the transformations  my focus was in the centre of the image due to the imposing dark space. I wanted to fill this space with the brightness of the fragments so that not only did the composition shift from structure to noise but the lightness of the image flipped as well.

Here I returned to the 'autumn' colour scheme I had in the beginning to see how the composition would work having a bright background instead of a dark one and although the final 'cross' that appears at the end is quite strong the overall series is quite hard to look at from its brightness.

Lastly I adjusted how strictly the random and drag components of the code acted and gained something that looked a little like this;

These will be my final forms. The colour scheme is a combination of the cobweb and frost precedents where it is highly desaturated but there are hints of blue within it. The thing I like most about this series of forms is that when looking at the first and last items there is virtually no resemblance but the two stage in between link them rather nicely. The degrading of structure to noise is heavily present in not just how the actual structure changes but the colours as well. The numerous overlaps create a range of densities, therefore a range of shades within the final one that are non-existent in the first stage. Now It's just a matter of print testing...