Week 11

This week our lecture was on 'High fidelity prototype and user experience evaluation."

A high fidelity prototype is a prototype that is quite close to the final product, with lots of detail and functionality. From a user testing point of view, a high fidelity prototype is close enough to a final product to be able to examine usability questions in detail and make strong conclusions about how behaviour will relate to use of the final product.
This high fidelity prototype I am creating is an app which is based on a problem that first year university students are having. My app is being created on a great website called InVision. InVision allows you to upload a wireframe to the site and than you can style and create the app how ever you like. I created my wireframes in InDesign first than uploaded them to than complete it. Today I spent most of my time making the app feel like a real app by creating buttons that jump from one page to the next and so on.

Usability testing is a very important aspect but the low fidelity prototype that we created in the first assignment has already addressed the usability issues.

The high fidelity prototype should;
1. look and feel very close to the finished product. And have
2. some functionality to test interactivity.

The next step is usability testing and they are;
1. Heuristic evaluation
2. User evaluation.

User experience evaluation is a very important step as it evaluates the high fidelity prototype and helps with finding problems and fixing them. Most of these evaluation tools help capture abstract indicators of experience.

Than we get to the user experience: emotional response.
Emotions are important in the users everyday lives and it is important to have an emotional impact on them.
We can ask ourselves questions like;
Is it fun? Is it exciting? Is it innovative? Is it engaging? Is it motivating? Is it desirable? Is the visual layout attractive? Is the visual layout creative? Will the design delight the user visually, aurally or tacitly? Is the first touch point exciting? Can the product add the the users self esteem? Does the  product convey the branding and organisation?
And these are all questions we need to ask the users to make sure we are hitting the mark with our apps.

When we measure emotions we can use a simple creation like this.

Unpleasant                                       Pleasant emotions
Indignation                                        Desire
Contempt                                           Pleasant surprise
Disgust                                               Inspiration
Unpleasant surprise                           Amusement
Dissatisfaction                                   Admiration
Disappointment                                 Satisfaction
Boredom                                            Fascination

There are 2 dimensions of emotion variants and they are pleasantness and activation.
 - Pleasantness to unpleasantness
 - high activation to low activation

This is a diagram that helps with the measuring of emotions, called Circumflex of affect. 

And this is just a simple quiz like thing to help know what the users are thinking emotionally. 

There are three dimensions when dealing with measuring emotions and they are;

- Visual and sensory: Pleasant to see, feel good to handle, easy to use, looks and feels like fun.

- Sociological: Makes you proud to use it, enhances your social image.

- Idealogical: Make you feel better to use it and makes a statement about you. 

And to find out how well your app creates these things you need to use a simple questionnaire to give to the users to find out. An example is a questionnaire like this;

When receiving this type of questionnaire back we need to take into account how the users are feeling and work with it. If they are not content with the colours you have used, than use different colours, if they feel it is boring, add some excitement into the app. Its all about testing and evaluation with products we create. 

High fidelity prototype

Visual and information design is another important step in this application process. Hierarchy is created based on users expectations. Schemas patterns e.g., going up (increase) going down (decreasing). 

Another important part is to use conventions when designing products. Design conventions are important as they are a flowing design elements that continues through peoples work. You use design conventions so the users can understand what they are doing. 

The principles of this are:

Consistency:establishing or adopting appropriate patterns

Hierarchy: calling attention to the most important things

Personality: choosing appropriate expressive characteristics

There are always common mistakes that are made. Some elements to take note of are;

- Don't provide too much information, just the right amount

- Align elements unless emphasising difference

- Group like elements

- Position elements to help make hierarchy clear

- Use one clear typeface with a variety of weights

- Use type styles as the grammar of your visual language

- Pick colours that draw the eye 

- Use colour to emphasize similarities and differences

- Only interactive areas should feel interactive

- Apply design to form controls. 

These are the main elements you need to think of when creating a product for visual effect. 

My product is very brightly coloured as I want my users to feel happy and excited to use it. The font is Arial, with different weights. All the elements on the page are aligned in a nice style. My app helps first year university students of fixing their problem they are having with time management between studying and socialising. The app is exciting to use as it gives out free vouchers when you earn a certain amount of points. The app encourages students to want to do well with their studies. All these elements on my product are positive, and will hopefully make the users enjoy using it. I will be doing my testing and evaluation sometime through this week, as I have only just finished putting my app together in InVision. This assignment is enjoyable and I've have fun making my own product. 

References

Usability first. (2002). High Fidelity Prototype. Retrieved from http://www.usabilityfirst.com/glossary/high-fidelity-prototype/ 

Gudue, Raghavendra. (2015). 9291 User interface and experience. Lecture 10, week 11: High Fidelity prototype and user experience evaluation. [powerpoint slides].

Usability, (2015). Prototyping. Retrieved from
http://www.usability.gov/how-to-and-tools/methods/prototyping.html

Week 10

This week our lecture was on "Design for Experience"

We are finally up to our second part of the user interface and experience course.

Firstly what is user experience design?
User experience design (UXD or UED) is the process of enhancing user satisfaction by improving the usability, accessibility and pleasure provided in the interaction between the user and the product.

So what is user experience?
User experience (UX) is a term used to describe the overall quality of experience a person has when interacting with a product or system.

The next question is can we design experiences?
The answer is no we can not. We can only design occasion for experiences; experience themselves are personal.
As designers we try to observe peoples patterns and recreate them to evoke desired emotions, for example Christmas.
So in order for this answer to be a yes we must rephrase the statement as designing for user experience.

So why do we design for experience?
Because it is hot! Being an emergent discipline, User Experience does not yet have a strong, formal body of knowledge. Formal books that include the term in their title often cover only subgroups of user experience.

And why is design for experience hot?
Because their is always changing of consumer demands.
When people get used to something, they than start to look for something more.

So how can we design for experience?
Apple is a perfect example. It is one of the first organisations that understood the important of UX for staying competitive. Apple is constantly updating their software and introducing innovative elements
into their user experiences.

When designing for experience, it is about creating a product that elicits positive emotional response from target users. It involves three main elements, and they are;
1. Functionality design, usability (perception of ease of use)
2. Aesthetics/sensorial design (perception of visual attractiveness)
3. Hedonic quality/pleasurable to use(perception of positive emotion/pleasure of use)

Emotional design is another important aspect of the User experience design. This framework analyses products in a holistic way to include their attractiveness, their behaviour, and the image they present to the user and the owner. This framework not only allows us to understand how people react to the product but also helps us to design a product to elicit desired emotional responses to them.

There are 3 levels of processing in the emotional stages.
1. Visceral: refers to primarily to that initial impact, to its appearance.
2. Behavioural: refers to the look and feel, the total experience of using a product.
3. Reflection: refers to ones thoughts afterwards, how it makes them feel, the image it portrays.

And in order to use this framework you need to understand difference between need pleasure and appreciation pleasure.

- Need pleasure can be seen as pleasures that accrue by moving a person from a state of discontentment  to one of contentment.
- Appreciation pleasure are those that accrue because a person finds something positively pleasurable, no matter what their current level of contentment.
These pleasures are really important to know as they play a vital role.

Now comes designing for experience
Three main elements
1. Functionality
2. Usability
3. Pleasure/fun (aesthetics)

Aesthetics are very important! Attractiveness is biased. People tend to see attractive people as more intelligent, competent, moral, and sociable than unattractive people.
To make something aesthetically pleasing you can follow the norm or you can create something innovative. I believe that making things more attractive do attract the eye of the users and make it more enjoyable to use.
"Beauty in the eyes of the beholder" is a common quote that is used and this tells us that each individual has different likes on aesthetics.

The homework this week was to add our wireframes into Invision and start creating our apps, like a real application designer would.

In class today we continued to work on creating our apps. I added my wireframes in class as I did not get time to do that through the week. I have started doing my basic layouts in Invision. The website for high fidelity prototyping seems easy enough to use and I feel like I won't have much trouble with using it. Making our apps in this program is a huge part of our next assignment. This is the most important part for the assignment.
The lecture this week was very interesting and I feel like I have more of an idea of how I want my app to look and feel, and how I want the users to feel when using it. The lecture helped me with understanding that aesthetics are very important and that creating an app needs to be focused on the users needs and wants.

References

Gube, J. (2010). What is user experience design. Retrieved from http://www.smashingmagazine.com/2010/10/05/what-is-user-experience-design-overview-tools-and-resources/

Gudur, Raghavendra. (2015). 9291 User interface and experience. Lecture 9, week 10. Designing for experience. [powerpoint slides].

Norman, D. (2015). Emotional Design. Retrieved from http://www.jnd.org/dn.mss/emotional_design_pe.html 

Week 9

Last week was week 8 which is our week semester break. Our assignment was due on Easter Sunday at midnight. I submitted my assignment well before the due time, and I'm feeling confident I will do well with this assignment. I put in a lot of effort and done exactly as the template had told us to.


In week 7 we were not given a lecture so we had no homework or lecture for this week. Our teacher than wrote on moodle that we do not have a tutorial this week as he is on sick leave.
Instead of a tutorial we were asked to make an account with InVision. This is a program that will help us with our second assignment. He also put some videos on Moodle that we need to watch so we know what the next assignment is all about. We were also given our brief for the next assignment. The brief is;

Emotion and design: Attractive things work better *
*Norman’s (2002)
Introduction
You have so far done user research to identify a problem, proposed a solution, listed its requirements based on your research and prepared and evaluated a low fidelity prototype. In other words, you have a solid idea and are sure that you have a very functional and usable application at hand.
Now, we’ll move to second and final phase in development. You’ll take your proposed design from project 1 and work on its aesthetics and emotional qualities.
The following 3 steps are involved in this project.

1. Developing an interactive high fidelity prototype using inVision app.
   
2. Evaluating the prototype
   
3. Preparing a client presentation and a report.
   

Note: The InVision application can be found at www.invisionapp.com. InVision app expert will conduct an online session to provide you more information regarding this app. Make sure you don’t miss the online tutorial.
Deliverables
You will produce an interactive response to the brief that will include clearly defined information, design and interaction. The prototype will provide the user with screens and controls to perform the system critical tasks defined in your project 1 report. You will evaluate this prototype and submit its outcome as:
Presentation (video/slides with audio): Submit maximum ten minutes or less video to present your idea.
Project Report contents: Submit a report that contains the following:

1. Cover page with title and your details.
   
2. Project background and objectives
   
3. Prototype: Introduce and show your design as if it were produced for-real.
   Break down the features of your design that make it effective in relation to
   the brief.
   
4. Evaluation: Iterative process of refining the design based on prototype
   evaluation.
   
5. Design Element Break-down & Justification: Individual graphic elements that
   make up the design and explain their inclusion in relation to the brief.
   
6. Conclusion. 
   

This is our brief for the second assignment. Its all about creating the aesthetics and emotional qualities of the app you designed in assignment 1. 

This is to be a presentation that goes for 10 minutes or less, and we also have to submit a report to Moodle, that explains everything. 

This assignment is due on the last day of classes for semester 1. 
I feel like this assignment will take less time as we have already done the background research of the problem. We are now just having to design the aesthetics and a working app. Im excited to complete this assignment as its something that I have never done before.