Monday, 25 July 2011

DMA 101 - Panorama Project

Week 10 homework.
So, this time we need to use tripods, LDSR and Photoshop. The main idea is to take a group of photo by turnning the camera horizontally and just change the angle, use photoshop combine them togerther.

This was what I did. XD



Tuesday, 5 July 2011

DMA 179 - Downtown Adventure Morlock (Tourists)

A trip to Toronto donwtown, discovers creatative shops and culture markets for DMA.
Pictures are posted on Flicker.

Link to Flicker album:
http://www.flickr.com/photos/wonderpharmacies/sets/72157627003406373/
Group Name
Tourists
Group Members:
Allan Doe
Dawn Kim
Graham Kartna
Jalil Majul G.
Joseph Cheng
Mohsin Kamal
Norton Wong
Xin Liao

Overview:
      It was burnning hot that day, we went to downtown Toronto, I was really exciting for this assignment. Cool, fun and interesting.  Woke up at seven, didn't forget to take a photo of myself. Got ready and there I went. I met Mohsin at the subway station at St. Andrew around 9 30, and we waited for half an hour or so, till Dawn, Jalil and Graham showed up.  Still missing Norton and Joseph, so we decided to look for Emily St. first. It was on the corner of a inter-section. Took a few pictures and followed our gudie of the day, Graham. Haha, a really good one, cause he lives near by.
     After half an hour, Norton and Joseph showed up. Dawn had to go back to the station to pick them up. So the trip finally began!!! We were like tourists, capturing every interesting view of the city. We met Allan when we came out from the black market place. There was a couple kissing in front of the Hot dog spot!!! I almost took a picture of them, but missed the time T T. Oh, and the hot dog guy doesn't like people taking pictures of him, cause Jalil was about to do that, but he refused. 
     They didn't have the drink on JAVA bucause it was a Monday. T T, what a pity... I didn't expect the trip would finish up this soon, but we only spent 2 hours on this. On the way back, everyone starts to get more pictures and we talked a little bit at Osgoode, then everyone went HOME!!! What an unforgetable day I had. Hope to do more of this, XD.

 

DMA 179 - Paper Zoo

     We are required to draw 12 animals in total from sketch book and scan them into photoshop. Using techniques from photoshop we get the sketch with out backgrounds (just the drawing lines) and put them on the background we drew in class.
     So here were what I did.
     
- Step 1 - Scan



     




















- Step 2 - Photoshop Processes

Channel Function (Copy the Red Channel)


Control + L brings the Level Window


Control + M brings the Curves Window





Back to layers copy the background layer and select the rigon of the giraffe


Cut the rigon and open a new page paste it on.
- Step 3 - Combine the sketches with background and information of the aniamls






















Wednesday, 29 June 2011

DMA 188 - UI Blog

Principle #1 - Structure
  • The interface is organized productively and keeps certain purposes categorized.
  • Focus on the UI architecture, keeping it simple and apparent, easily recognizable of its functions.

Technique #1 Word your messages and labels effectively
Users of all levels are able to understand the functionality and purpose of the information given. Wording is simple yet effective enough to understand.

Technique #2 Your design should be intuitable
To accompany trial and error for the better learning curve, users can find out which button serves which purpose, also with the help of certain images and/or symbols.

Technique #3 Group things effectively
Grouped items can be in great effect when done correctly. In this case, Microsoft Word allows users know where to find certain functions for different tasks without any trouble.


Microsoft Word and other Microsoft Office applications are reliable and known to be very organized into categories and separate pages. It shows the architecture of how they built the interface well enough so that navigation for users is easily recognizable, and simple.

Principle #2 - Simplicity
  • The user interface must not be complicated or clogged up with useless information.
  • Simple keyboard & mouse commands to lead to the user’s desired destination or end result should be quick and easy.
  • Communication between the user and interface is vital so that the product is usable for anyone.
Technique #1 Follow the contrast rule
Creating colors and objects fit for the user’s eyes at all times is important so that frustration or any type of harm does not affect the user. In this case, the seemingly light grey background can match any other colored background and still create a sense of comfort for anyone.

Technique #2 Align fields effectively
Clean and efficient methods of organization are important so that the user does not complicate matters and see a jumbled up interface. Especially in this case, while the functions are easily labeled and somewhat categorized, the corresponding labels lead to another set of easily labeled functions.

Technique #3 Don’t create busy user interfaces
Creating screens that are difficult to understand make it harder for the user to use. The interface should not crowd the majority of the screen so that it creates a sense of simplicity and organization for the user.



Windows OS does a great job in keeping things simple and very user-friendly so that all levels of users -high or low- can use the interface well enough without running into problems. Communication between the UI and Windows is simple and straight to the point.

Principle #3 - Visibility
  • Giving the user too many options to choose from can complicate matters and take up too much time
  • UI regarding visibility should exclude unneeded information and aim to give the user only a selected few options.
Technique #1 Expect your users to make mistakes
Users of all levels should be able to deal with any sort of mistakes, allowing the interface to be as versatile as possible so that they may go back to the previous page/option and start again. In this case, virtually clicking anywhere will take the user back/to another selection.

Technique #2 Align fields effectively
Organized data is something all users look for on common grounds. By aligning sections from left to right and even creating drop-down tabs, it makes it easy for the user to operate on any grounds.

Technique #3 Navigation within a screen is important
As most users tend to start from the top left, navigation designs are created in a manner of top to bottom and left to right. In this case, both apply since there is a lot of content to go through while keeping it simple and understandable.



Amazon does a great job in organizing their website while keeping tabs organized and apparent enough for all users to easily navigate around their website, informing them of any necessary information and/or actions required to not give the user a hard time.

Principle #4 - Feedback
  • The users are being notified by the producers in well constructed language and images if needed. Any updates, mistakes, new techniques, changes made are informed to users.
  • Two way interaction, users give feedback to the producers, producers improve the techniques and report back to the clients.
Technique #1 Word your messages and labels effectively
In order to make users understand the information, the feedback that has been giving out by the producers need to be clear and simple written; in some cases images are helpful can be helpful, too.

Technique #2 Follow the contrast rule
Another way to deliver the feedback successfully is by using readable color of texts and backgrounds for the updates interface. In this case, the contrast rule, this is known as “Use dark text on light backgrounds and light text on dark backgrounds” could be really efficient.

Technique #3 Group things effectively
Related information and images are needed to be grouped together to create an easy looking interface. This way leads to a better reading situation for the users.



Adobe usually does nice jobs on their feedback part. The information is giving through email. It is easier for users to access because they don’t have to go and check from the official website. The contents are well designed, includes video which helps the clients avoiding boredom. Related information are grouped together to stay away from confusion.


Principle #5 - Tolerance
  • The User Interface has to assume that users make mistakes while they access the product.
  • Actions such as redo, undo, tolerating and interpreting increase the usability and make the product handier.
  • These actions and corrections have to be accurate and noticeable; therefore, it can keep clients on track.

Technique #1 Expect your users to make mistakes
This concept is like the definition of the principle, only when this technique is applied, the tolerance can be created and modified. Understanding users make mistake is much more important than actually dealing with it.

Technique #2 Navigation between major user interface items is important
For instance, the connection between a modified word correction and the original spelled word has to be well recognized. Software are designed to meet this requirement by creating reasonable lay outs. Thus, reduces the amount of frustration for users.

Technique #3 Consistency
The tolerance principle has to be consistent. It should apply to all errors and mistakes that users made. This will help the users understand the way this application works faster and more effective.


Microsoft Office software is the most obvious example. They ensure users will make mistakes when they typing a document. They offer automatic spelling corrections and grammar check in variety condition, easy to use and really useful.


Principle #6 – Reuse
  • Resources are supposed to be reusable in both internal and external ways, such as save the file and re-edit it again.
  • The software is not only going to be focused on interface designing part but also functional-wised and purpose-wised.
  • Create hot keys or short cuts to help users save time, most importantly, easier to operate.
Technique #1 Navigation within a screen is important
Users are able to understand the function of each key within the screen and perhaps extra information that shows the short cuts. The way of showing this has to be simple and it is important to pick a similar one which most users have used before, so when they works with the software, it becomes handy.

Technique #2 Understand the UI widgets
In order to make your software operates the way it supposes to be, one must understand what the right widgets for the right function is. The matches between user interface and widgets needs to be reasonable and understandable, otherwise, it will confuse users.

Technique #3 Don’t create busy user interfaces
Reuse function interface have to be remarkable and cleaned. Incorrect labels and ungrouped options will only make the software hard to use.



Reuse principle applies everywhere on our daily life when deals with a computer, the most common one is the Windows system. Users are able to look at the sign to go back and forward when opens a sub file. Users are able to export and import data from one to another, and reuse ability could be done by doing data transferring.

Members: Xin (Catherine) Liao & SangKyum Dawn Kim