NED12 Visual weight

Visual weight an illusion of physical weight, such as with bold face type.

Balance where visual weight appears to be equally dispersed throughout the design.
- Symmetrical balance: mirrored distribution on either side of an imaginary vertical access
- Asymetrical balance: the arrangement of unequally weighted elements in a design.

Further reading:
* Visible Narratives: Understanding Visual Organization by Luke Wroblewski
* Composition and Design Principles by Marvin Bartel
* The Principles of Design by Joshua David McClurg-Genevese

NED12 Designing a unified interface

Another important element of design - unity. Coherence, usability, better communication. Psychological studies have shown that users want to see unity, if they don't see this they lose interest.

Unified design needs a consistent visual style throughout the document/site. Visual devices include visual style, alignment, balance, flow, and a grid.

Creating unity with visual style:
* Use similar colors
* Use similar shapes
* Use similar line weights
* Use similar typography
* Use similar photographs
* Use similar illustration styles
* Use same artist for all graphics
* Repeat the elements above you use throughout your site

Further reading:
Some examples of unified design through repetition, proximity, continuation.
Unity - Basic principles of design, from About.com

NED12 Alignment and the grid

Elements that are lined up with each other share a visual connection that can enhance design and increase usability and legibility. Consistency, predictability are essential elements to any well designed information system.

Grids are commonly used in design (and I've heard the term bandied about a lot!) to help with alignment. A good grid design is a flexible one - it can have as many or few grids as desired, and there will be times when breaking out of the grid is appropriate. The goal when working with a grid for web design is to create a consistent layout that allows you to plug in text/graphics, without having to rethink the design approach on each page. (Lynch & Horton 2001)

A new term introduced here - registration, in reference to precise alignment, positioning of elements down to the last pixel.

Further reading:
* Why use a grid? Mark Boulton
* Grid systems for the Web Part 1, Part 2 Fixed, Part 3 Fluid, Mark Boulton
* Grids are good [PDF] excellent presentation by Khoi Vinh and Mark Boulton
* Smashing Magazine's Designing with grid-based approach lists references and resources
* Designing grid-based blog template, Michael Angeles
* Design By Grid articles, tutorials and resources

NED12 Getting colours right on the screen

Gamma correction - generally what looks good on a Mac, appears too dark on a PC and conversely, images created on a PC often look light and washed out on a Mac. Gamma is set by adjusting a numerical value - Macs have a default gamma setting of 1.8; on PCs the default is around 2.5 (but there are many variables). W3C has set a Web standard to 2.2 for all platforms (also suggested by CGSD back in 1998), creating an easy medium.

I followed the steps listed in Joe Gillespie's article on Palettes to make a gamma correction on my PC. The first thing that happened was everything got a lot brighter and I could distinguish darker shades a lot better. My browns don't look so red now, either.

Did you know the word "pixel" was created from picture element? Lynch and Horton mention this in an explanation of bit colour display.

My own display is set to 32-bit colour, but I discovered that it actually has the same number of colours as 24-bit display, the extra byte is for an alpha channel which optimises memory - 'The only reason this is done is that on the Intel 32-bit PCI/AGP/Memory data bus its more efficient to get at data that is "32-bit aligned". [with 24-bit data you often actually have to read the pixel's data twice--and then mask for the bits you are interested in]' (John Schilling, Scala, 2002)

Using your noggin

Another link courtesy of my sister, Luciano Passuelo's new site LiteMind is all about exploring ways to use our minds efficiently. My favourite articles would have to be How to Recall an Entire Book in 5 Minutes or Less and What is Mind Mapping? (and How to Get Started Immediately) since both of these things are pretty good to have a handle on for uni.

Luciano is a fan of famous quotes also, and has convinced me it is not just idle entertainment.

Instinctive reasoning

I get a daily quote on my Google start page each morning. This one today by Bertrand Russell is profound:

If a man is offered a fact which goes against his instincts, he will scrutinize it closely, and unless the evidence is overwhelming, he will refuse to believe it. If, on the other hand, he is offered something which affords a reason for acting in accordance to his instincts, he will accept it even on the slightest evidence. The origin of myths is explained in this way.

Of course, underneath this quote (I get two a day) was a gem from Walt Disney:

I love Mickey Mouse more than any woman I've ever known.

NED12 Colour theory

Some reading to get through this weekend:

Digital Color Wheel
Colors on the Web
Color Theory

Colour schemes created via the colour wheel:

• Analogous - colours next to each other on the wheel, match well, no contrast - serenity, comfort.
• Complementary - colours directly opposite each other on the wheel - high contrast, vivid, stand out.
• Split complementary - combination of a colour with the analogous colours of its complementary on the wheel.
• Triad - three colours located at equal distance from each other on the wheel.
• Tetrad - four colours found at each corner of a rectangle or square placed on the colour wheel.
• Diad - two colours that are two colours apart on the wheel

Some terms to remember:

• Hue - another name for colour!
• Tint - a light colour created by mixing with white
• Shade - a dark colour created by mixing with black
• Value - increases according to the amount of black
• Saturation - the level of colour - full colour = vibrant

Types of colour:

• RGB - red green blue; additive colour scheme, uses the absence/presence of light to create colours, primary colours combine to create white.
• CMYK - cyan magenta yellow black; subtractive colour scheme, uses the absence/presence of pigment to reflect or absorb light, primary colours combine in equal amounts to create the appearance of black.

Effective colour combinations:
A school of thought believes the most effective combination is red, black and white, but the commonly used rule is to use three colours - a main colour, a similar secondary colour and a contrasting highlight.

Thinking like a genius

Since introducing my sister to StumbleUpon she has been finding all these cool sites and sending them to me. She thought my studies could use a bit of help and guidance and sent me this link to Thinking like a Genius. It's all about thinking productively and creatively rather than reproductively, something they taught us in REA11.

I also found this resource on Critical thinking on the Web (all by myself!) which looks pretty good - lots of links and quotes and references there.

NED12 Usability

An important aspect of good graphic design is creating an interface that is visually appealing and intuitive - interesting to use without having to think too hard about it. It's all about the audience:

Graphic design creates visual logic and seeks an optimal balance between visual sensation and graphic information. Without the visual impact of shape, color, and contrast, pages are graphically uninteresting and will not motivate the viewer.

Visual and functional continuity in your Web site organization, graphic design, and typography are essential to convince your audience that your Web site offers them timely, accurate, and useful information. A careful, systematic approach to page design can simplify navigation, reduce user errors, and make it easier for readers to take advantage of the information and features of the site. (Lynch & Horton 2001)

There is quite a difference in opinion in how usability and graphic design are intertwined on the web, as discussed in Usability Experts are from Mars, Graphic Designers are from Venus and Usability is not Graphic Design. The web site of well known usability expert Jacob Nielsen is described by the University of Greenwich as "inelegant".

Some of the ways graphic design support usability, a walk through arranging information and analyzing graphic design.

Some interesting comments by Anne Harris in Building for Usability. She suggests instead of creating a plain vanilla looking site by building down to the lowest common denominator, we aim high and build in the ability to scale down. Makes sense.

NED12 How to critique

After the process of experimentation it is a good idea to critique, or evaluate your work - it forces you to view your work objectively and assess how well it meets the project objectives.

Robin Landa provides the following checklist to refer to when evaluating your design solutions:

Part I: The Project

1. Restate the goal or aim of the project – in your OWN words. Do this to make sure you understand the problem you are setting out to solve.
2. Did you fulfill the goal you were supposed to achieve? Did you miss the point of the original problem you were trying to solve?
3. Is your solution appropriate for the audience or purpose of the project you are working on? For example, are your colors childish or corporate?
4. Is your solution appropriately executed?
5. Are you using a suitable visual hierarchy of information? Will your audience know where to look first, second, and third?
6. Does your solution communicate the intended message to your audience appropriately? You can ask people to tell you what message they are interpreting from your design.

Part II: The Process

1. Did you do any research? If so, how did you use it? Should you have done more?
2. How many thumbnail sketches and roughs did you do before you created your comp? How much time did you really think about the problem?
3. Did you experiment outside of your comfort zone? Or did you stick to your area of strength?
4. Did you make any false assumptions about what you could or couldn't do? Or did you take a positive approach that you could do anything if you really tried? It is very important to experiment and build your confidence in designing. Try flipping, stretching, skewing, speckling, etc
5. Did you really allow yourself to become involved in this problem you were solving? Did you use your imagination and feelings? Were your feelings personal or removed?
6. Were you too judgmental? Did you give yourself a chance to be creative? Were you patient with the project and yourself? Don't be so hard on yourself that it makes you afraid to take chances.
7. Did you take chances? Were your solutions innovative? Did you dare to be different? Or did you do what most people would do? One way of determining this is to compare your solution to others? How many other people reached the same conclusions?

For critique exercise, some inspiring designs:
www.patagonia.com (DI) - a simple, clean looking interface with lovely huge wildlife or landscape photographs, lots of white space giving an impression of space, simplicity. Browsing the navigation bar there is quite a lot of information available on the site, but it is cleverly designed so as not to confuse or overpower the visitor.

spanish-portuguese.berkeley.edu (DI) - another clean, clear look. I love the typography on this one. There is a LOT of text, but it has been presented in a decorative way so as not to be overpowering or boring.

www.crocs.com (DI) - This is a very bright and funky interface, which I think says a lot about the product - it is fun, colourful fashion. At the same time it is clean and simple, easy to navigate - allowing focus on the product.

And some poor designs (featured on webpagesthatsuck.com):
www.westservicecenter.com
www.redbloodclub.net
meteo.previsionsfrance.org

Basic principles of design from Digital Web, a Flash site to check out www.thefwa.com (courtesy Jo J.)

NED12 Graphic design basics

Well it's week one in a new study period and I'm looking forward to the fresh start, although I had some initial apprehensions about this unit because design has never been one of my strengths. Hopefully the theory we cover here will give me more confidence.

In the first reading we are told that to learn to design, we must think like a designer. This involves problem solving, asking questions, research and experimentation. So it's not just about making things look pretty!

Some points on experimentation and turning doodles into designs:

1. Think with your mouse or pencil in your hand. Doodle until you've found some interesting visuals. Then try sketching them into small thumbnail sized drawings. It may seem frustrating at first, but you can't just think about how you are going to design something. You have to experiment with a range of ideas – and not just go with the first one that pops into your head.
2. Choose three of your best thumbnail sketches and turn them into roughs. Roughs are sketches that are larger and more refined than thumbnails. They help you visualize your ideas more realistically. If you use tracing paper, you can combine your sketches to create interesting composites that might solve your design problem. If your sketches aren't working out, go back to develop others from your collection of thumbnails. Once you are satisfied with some sketches, don't hesitate to wait a day or so before moving to the next step.
3. Choose your best rough and turn it into a comp, mock-up, or prototype. A comp, mock-up, or prototype should look like the real thing. It should look extremely clean and accurate.

(Landa 1996)

NET12 Dropout

In a previous post I described how I barely managed to hand in my second NET12 assignment. Things steadily degenerated from there, and by the final week I was way behind and hadn't even started assignment three. I just hit a wall halfway through the study period, and it was all I could do to complete NED11. It's disappointing, but I just have to get over it and move on. I'll give NET12 another try next year. Geez I hope I pass NED11!

UNE to act on spate of plagiarism

A report on VillageVoice.com.au (22 Aug, 2007) that the University of New England in NSW has detected a spate of plagiarism amongst theses submitted over the last few years for an IT masters program, and the students involved could be stripped of their degrees.

Notably the theses were all written by international students. Although the report doesn't state where the students come from it is apparent there are cross-cultural factors involved. A search on Google reveals there is much comment on the issue of cross-cultural plagiarism, and it is also the subject of several academic studies.

The report states the students were part of a program run by a commercial partner of UNE. I would hope as well as making a fair decision on what action is taken against the students, that UNE also considers the role and actions of its commercial partner in making students aware of the issue.

Nearing the end of SP2

Fellow student Kathleen sent me a sticky note on Facebook - "Hang in there - SP2 is nearly over!". Very welcome words, this has been the shakiest SP for me since my first enrolment. I really don't know how they do it, these other students who take on four subjects at once. I took only two, but after this SP I'm going back to doing one at a time.

CafeScribe - textbooks 2.0

This is a new service that has a lot of potential, although there is not a lot of content available at the moment I can see CafeScribe really taking off as perhaps another Facebook, its focus on students.



It offers e-book versions of university textbooks for download, at reportedly half the usual print price, providing the opportunity to save some money as well as a few trees. Students can also upload their own PDF documents and share notes, add "friends" to their profile and join student discussion groups.

This sharing of notes and documents might raise some issues about collaboration, or breach of copyright if students are sharing published texts. The service does address the latter issue in its Terms of Use but it is yet to be seen how this would be enforced. There have been a few similar sites offering "textbook sharing" which seem to cross the line, but as one author/lecturer remarked, for small time publishers it's probably not worth the cost of legal remedy.

External links:

• E-book site for students promises to save trees, money Sabena Suri, CNet Aug 2007
• Post by Kristen Nicole on Mashable, Aug 2007