People Module #4 – Navigation Importance.

•October 12, 2009 • Leave a Comment

One of the most frustrating experiences you can have on a Web site is being unable to figure out where to go or where you are. I’d like to think that for most Web designers, navigation is a concept we’ve managed to master, but I still find some pretty bad examples out there. There are two aspects of navigation to keep in mind:

Navigation — Where can you go?
There are a few commonsense rules to remember here. Buttons to travel around a site should be easy to find – towards the top of the page and easy to identify. They should look like navigation buttons and be well described. The text of a button should be pretty clear as to where it’s taking you. Aside from the common sense, it’s also important to make navigation usable. For example, if you have a rollover sub-menu, ensuring a person can get to the sub-menu items without losing the rollover is important. Similarly changing the color or image on rollover is excellent feedback for a user.

Orientation — Where are you now?
There are lots of ways you can orient a user so there is no excuse not to. In small sites, it might be just a matter of a big heading or a ‘down’ version of the appropriate button in your menu. In a larger site, you might make use of bread crumb trails, sub-headings and a site map for the truly lost.

Guiding the eye…

Good Web design, perhaps even more than other type of design, is about information. One of the biggest tools in your arsenal to do this is precedence. When navigating a good design, the user should be led around the screen by the designer. I call this precedence, and it’s about how much visual weight different parts of your design have.

A simple example of precedence is that in most sites, the first thing you see is the logo. This is often because it’s large and set at what has been shown in studies to be the first place people look (the top left). his is a good thing since you probably want a user to immediately know what site they are viewing.

But precedence should go much further. You should direct the user’s eyes through a sequence of steps. For example, you might want your user to go from logo/brand to a primary positioning statement, next to a punchy image (to give the site personality), then to the main body text, with navigation and a sidebar taking a secondary position in the sequence.

What your user should be looking at is up to you, the Web designer, to figure out.

To achieve precedence you have many tools at your disposal:

  • Position — Where something is on a page clearly influences in what order the user sees it.
  • Color — Using bold and subtle colors is a simple way to tell your user where to look.
  • Contrast — Being different makes things stand out, while being the same makes them secondary.
  • Size — Big takes precedence over little (unless everything is big, in which case little might stand out thanks to Contrast)
  • Design Elements — if there is a gigantic arrow pointing at something, guess where the user will look?

Personal Project – Proposal

•February 12, 2009 • Leave a Comment

 For my personal project I will be attempted to physically create my Idea developed during the Design Process Project. Just to recap, my design process project envolved the creation/modifcation of a peice of existing software that was designed to read facial movement via a camera device, similar to the Playstation’s Eye Toy for example, but primarily focused on facial animation, which could be used in various different industries, to examples would be Video Games & Learning Software.

 I have chosen to create a scene from a game, specifically in the field of Role-Playing Games(RPG), games that focus not only on action, but story and meaningful dialogue that immerses you into the world. A rather unique RPG peaked my interest a few years back named “Vampire:Masquerade Bloodlines”, heavily focused on your role as a Vampire within a breathing city, several typical Vampire themes were included, Love, Sexual Seduction, Predator/Prey, dark gothik themes. I intend to use this theme as the basis of my interactive scene. However, there will be no script as you would expect to find within an RPG, it will be a simple scene, an example would be a scene where you are a female vampire at a bar, hopefully if all goes to plan her facial expressions (For now, mainly the mouth) should be controller by the user who’s using the Mic/Camera device.

Vampire Masquerade, Dialogue
Example: Vampire Masquerade, Dialogue

I decided to attempt to make a 3D scene to go along with the headset, to satisfy the artistic criteria of an end of year show production.

Proposal – Personal Project

•February 10, 2009 • Leave a Comment

Process Module: #3 Camera Technology Research

•February 8, 2009 • Leave a Comment

Eye Toy – An Example of Interactive use of Camera Technology

Eye Toy, PS2 Slim

Eye Toy, PS2 Slim

The EyeToy is a color digital camera device, similar to a webcam, for the PlayStation 2. The technology uses computer vision and Gesture recognition to process images taken by the camera. This allows players to interact with games using motion, color detection and also sound, through its built-in microphone.

The camera is manufactured by Logitech (known as “Logicool” in Japan), although newer EyeToys are manufactured by Namtai. The camera is mainly used for playing EyeToy games developed by Sony and other companies. It is not intended for use as a normal PC camera, although some people have developed unofficial drivers for it. As of November 6, 2008, the EyeToy has sold 10.5 million units worldwide.

Process Module: #2 RPG/MMO RPG – Voice Immersiveness (Microphone & Cam)

•January 25, 2009 • Leave a Comment

For this idea, I have decided to go with a feature not present in any MMO/RPG, making combination of prototypes that will allow the user to manipulate thier characters facial animations, voice overs for both Multiplayer and Single player games.

What is required:

Design Ideas

Design Process

Several prototype designs of a comfortable yet unique headset choice incorperating Microphones and Webcams.

Prototype “Examples”

Prototype testing.

Present my findings/results/designs.

Process Module #1 – Video Game Genres

•January 23, 2009 • Leave a Comment

Design Processes – Enhancing Video Game Genres.

Role-Playing Games

NPC Interaction

Conversations/Emotions

· Text Selection Conversations – Diagram Trees resulting in fixed dialogue, that the player selects either by clicking with a mouse or direction arrows on a joy pad.

· Emotions – Player Animations that resemble actions/gestures, can be used for NPCs to recognized and respond to.

· Voice Input – Voice Input is something that I have always wondered about in RPG games, similar processes have been used in Shooter games and Strategy games to command squads and armies, my idea is to extend this to the RPG Genre, seeing as role-playing and immersion come in hand to hand, it would be more immersive if the player’s voice was used to converse with NPC’s in role-play dialogue or battle commands. (LINKED – Character Aesthetic, Animations).

Combat

Combat Style

Skill Recognition

Immersion

User Friendly

Fun Factor

Online Incorporation

Competitive

Recreational

Character Enhancement

Linear Level System

Comprehensive Skill System

Physical Appearance

Accessibility

Character Aesthetic

Shooters

Platform

Action-Adventure

Simulation

Fighters

Strategy

Adventure

Racing

Process Module Begins…

•December 13, 2008 • Leave a Comment

It surely does.

Hardware Hacking #1

•December 13, 2008 • Leave a Comment

Hackerz

London Baby!

•November 28, 2008 • Leave a Comment

Londooon!

Museum Visit Assignment.

•November 28, 2008 • Leave a Comment

Bah Blah

 
Follow

Get every new post delivered to your Inbox.