Sunday, October 24, 2010

Reflections


Alas, I have now come to the end of my blog assignment. This should come as a relief, which I do feel to some extent but strangely, I also feel a tinge of wistfulness, akin to losing something I created…

The process of creating the weblog has itself been a journey of learning. I have learnt to blog, posting topics for discussion and through reading other blogs, learnt about blogging issues, picking up some new terms (such as UX) along the way. Not forgetting design and publication issues, all of which required relevant reference reading. Selecting and posting topics of interest to me helped to deepen my appreciation for the topic while allowing me to voice my humble views.

While I learnt the dynamics of blogging, finding out I could edit and make use of the tools available in this communication medium, I found it actually got easier as I made more posts. I knew instinctively what I needed to do such as highlighting words, adding relevant links, citing worthwhile references, selecting keywords and suitable images.

The mindboggling idea of actually starting a blog myself initially intimidated me - I felt fear and apprehension on how to even get started as I was totally new to blogging. Help came in many ways with friends and loved ones showing me support and encouragement, telling me blogging is easy and not as technical as I imagined. I would like to thank all of these people who have helped me in completing a worthwhile and thought-provoking assignment. 

For now, I am going to take a leaf from The Blog Herald's '18 Core Blogging Skills You Can Always Improve' and work on improving my future blogs! 

Image source: http://i942.photobucket.com/albums/ad267/NotNormalNatalie/Photography/Leaf-Water-Reflection.png

Ethics of Image Manipulation

Image Manipulation - Ethics and Aesthetics


The Loch Ness monster picture also known as The Surgeon’s Photo (featured above) was probably one of the most famous doctored photograph of our time. Photoshop did not exist then but whenever we correct, manipulate and enhance images whether on conventional darkroom or digital photography, questions of ethics and aesthetics arise. When is too much? 

The dictionary describes ethics as ‘a set of moral principles or values’ while ‘ethical refers to conforming to accepted professional standards of conduct’. These are rules humans invented that define what we think is good and bad, right and wrong. However, as with all human behaviour, everyone has their own unique view on ethics.

With digital technology and processing, there is almost no limit to how we can manipulate an image. While some images are manipulated to enhance aesthetics, some changes are done for less-honorable reasons, including misrepresentation and intended deceit. Changes can be made to images that are undetectable, so much so that there are discussions that photographs may no longer be allowed as evidence in courts of law.

Society decides the rules for what is considered ethical behavior and these rules can and will change over time. Today's viewers are very sophisticated visually and know full well that anything, literally, can be done to an image. Lifelike dinosaurs and aliens are portrayed in the movies, while Photoshop enhancements are seen in publications and multimedia entertainment any day.

Ethics is compromised when allegedly factual mediums such as the news business, academia and research publications risk their credibility with manipulated images. Through the years, the media has regularly seen use of manipulated images to make news, including Reuters’ admission of altering Beirut photo, raising questions of journalistic integrity and credibility. The Office of Research Integrity of the US Department of Health and Human Services (ORI) found that, in 2007–08, 68% of all of its opened cases of research misconduct involved falsified images (see graph below).

ORI cases of falsified images

Back in 1964, Ken Garland’s First Things First: A Manifesto acknowledged the “high pressure consumer advertising” world that designers have to contend with but that they should endeavour to “a reversal of priorities in favour of the more useful and more lasting forms of communication” to serve more “worthwhile purposes”. Well said, for humans are visual creatures and the communication adage ‘a picture says a thousand words’ still holds true today. The problem is, can we trust what we see anymore?


Related readings





Reference
Gilbert, N 2009, ‘Science journals crack down on image manipulation’, Nature News, viewed 22 October 2010, http://www.nature.com/news/2009/091009/full/news.2009.991.html

Garland, K 1964, ‘First Things First: A Manifesto’, Ken Garland: Published Writing, viewed 22 October 2010, http://www.kengarland.co.uk/KG%20published%20writing/first%20things%20first/index.html


Wednesday, October 20, 2010

Banner Blindness



Dr Jakob Nielsen, proclaimed the “guru of web usability” by The New York Times, is a widely acknowledged expert on web usability. In 2007, Nielsen studied about banner advertising, coining the term “Banner Blindness”, describing how web-users typically ignore advertisements on the web.

Nielsen summarized that users rarely look at website display ads, and that to increase the effectiveness of banner advertising, an ‘unethical’ and deceptive method commonly used is to trick users into clicking onto the ads by disguising them as editorial content. An example of this is by incorporating fake “OK” or “Cancel” buttons after the pop-up ads, whereby the user is somehow diverted into the advertiser’s site.

Earlier studies in 2004 by Nielsen have shown that such online ads are either “very negatively” or “negatively” perceived by a whopping 94% of Web users, just 1 percentage point behind universally hated pop-up ads. His studies further concluded that, when users dislike online advertising, they “transfer their dislike to the advertisers behind the ad and to the website that exposed them to it.” Suffice it to say, familiarity breeds contempt. Users learn when they are duped by an online ad - gradually, that's how banner blindness come about.

Nielsen conducted extensive eyetracking studies that have conclusively proven that users “almost never look at anything that looks like an advertisement.” A 2003 survey conducted by PlanetFeedback, showed that only 8% of U.S. consumers trusted banner ads (right behind infomercials, but ahead of door-to-door salesmen, spam, and pop-up ads) with 53% respondents annoyed by banner ads.

Substantiating this research, a study published in BusinessWeek in November 2007, titled “So Many Ads, So Few Clicks”, reported that “the truth about online ads is that precious few people actually click on them. And the percentage of people who respond to common banner ads … is shrinking steadily”, with the average click-through rate having fallen to 0.2% in March of 2007 after several years of decline.


The results of this study have been substantiated in other independent research. Burke et al. (2005 pp. 423-445) experimented on the effects of banner ads on visual search, using 4 kinds of banners – animated commercial, static commercial, cyan with flashing text and a blank banner. The study revealed low banner recall, with animated banners faring way behind static ones.  
An advertiser contemplating online ad space will do well to take note of these findings, for it is easy to conclude that such ads do not represent a very sound return on investment.

Norman (1999) summarized that "Banner Blindness" findings are a reaffirmation of the rules of consistency, coherence, and the patterns of established conventions. Cognitive schemas guide user attention and focus. Web designs should follow a ‘clear, coherent conceptual model, consistent with established conventions and genres’. Front the important things first, just like how one would relish the toppings of an ice-cream.

Related Articles:





Reference
Burke M, Hornof A, Nilsen E, Gorman N 2005, High-cost banner blindness: Ads increase perceived workload, hinder visual search, and are forgotten, ACM Transactions on Computer-Human Interaction, Vol. 12, No. 4, pp. 423-445.

Business Week, So Many Ads, So Few Clicks, 12 November 2007, viewed 20 October 2010,
<http://www.businessweek.com/print/magazine/content/07_46/b4058053.htm?chan=gl>

Nielsen J 2004, The Most Hated Advertising Techniques, Jakob Nielsen’s Alertbox, 6 December 2004, viewed 20 October 2010, <http://www.useit.com/alertbox/20041206.html>

Nielsen J 2007, Banner Blindness: Old & New Findings, Jakob Nielsen’s Alertbox, 20 August 2007, viewed 18 October 2010, <http://www.useit.com/alertbox/banner-blindness.html>

Norman D 1999, Commentary: Banner Blindness, Human Cognition and Web Design in Internetworking, March 1999, viewed 20 October 2010,

Image source:http://www.silenceisnonexistence.com/wp-content/uploads/2007/10/blindfold.jpg

Monday, October 18, 2010

Document Design



Document design is the field concerned with creating texts, that is books, pamphlets, posters and others that integrate words and pictures in ways that help people to achieve their specific goals for using texts at home, school, or work” (Shriver, 1997).

Good document designs
               Guide readers through by directing attention.
               Create retention value on important points.
               Increase reader interest.
               Achieve focus through
              Conscious use of design principles
              Graphic aids
              Attention-getting format devices
               Reflect and enhance the desired message.


The principles of design are qualities important to any visual presentation. According to Reep (2006), 4 general principles are to be considered when designing any document:        
              Balance
              Proportion
              Sequence
              Consistency

Balance

Page balance is about comparable visual “weight” on both sides of a page.
·         Weight matters!
·                     Big weighs more than small.
·                     Dark weighs more than light.
·                     Color weighs more than black and white.
·                     Unusual shapes weigh more than simple circles and squares.
·         Positioning – where the above elements are placed and used offers perspective on how to use the document.
·         Arrangement – arrange elements so that the overall look is held together in harmony.

Proportion

·         Size and placement of text, graphic aids and format elements – serves as a guide and help draw attention to what matters more on the page.
·         The Rule of Thirds technique helps to establish proportion in an image.

Sequence

·         Establish the hierarchy in the best possible order for easy comprehension.
·         Draw the eye to the most important point and then to the next.  
·         Readers tend to read starting from top left and then scan down left-right before ending downwards towards right. Read about the Gutenberg diagram (cited in Butler, et.al. 2003).
·         Use ‘weightier’, that is, heavier colours to guide desired direction and sequence.

Consistency

·         Keep to similar features, similar elements and similar styles.
·         Keep margins and indentations uniform.
·         Typeface – Use the same family of fonts to avoid disjointed content.

The use of white space, colour, typographic devices, graphic image, graphic aids and formatting elements are also pertinent to good document design. Good document design aids document usability and offers clarity of content and message.   

Related readings:


Reference
Butler J, Holden K, Lidwell W 2003, Universal Principles of Design: 100 ways to enhance usability, influence perception, increase appeal, make better design decisions, and teach through design, Rockport Publishers, Beverley, MA.

Reep DC 2006, Technical Writing, 6th edn, Pearson/Longman, New York.

Shriver KA 1997, Dynamics in Document Design, John Wiley & Sons, New York.

Sunday, October 17, 2010

Web Usability


Stunning visuals aside, the true mark of a good website design lies in its usability. According to Usability.gov, a US government’s guideline portal on developing user-centred websites, good web designs ‘facilitate and encourage efficient and effective human-computer interaction’. A user-centred website enhances user experience.

Some of the key points to note according to Smith (2010) are:

·        Use of grid for website structure
·        Search box availability
·        Make navigation easy to read with commonly identifiable logo use.
·        Create a contact page, with email address and a simple contact form.
·        Collect data and generate reports by utilizing UX applications – that is, User  
      Experience measurement tools such as Clicktale, CrazyEgg, Feedback Army, Google  
      Analytics, etc.
·        Organized sidebars free of clutter.
·        Check browser compatibility of website – Opera, Internet Explorer version 6, 7 &
      8, Chrome, Firefox, Safari, etc.
·        Consistency in page design and structure to maintain web identity and familiarity
      for users.
·        Enable content printing - add a ‘Print-friendly version’.
·        Avoid overcrowding and keep small spaces minimalist to aid focus on important
      stuff.
·        Include breadcrumbs for ease of navigation.
·        Use colour and contrast to shift focus and emphasize importance.
·        Checks for broken links and images. A free broken-link-checker tool is iwebtool.
·        Make use of footers – add search box, subscription, interesting articles or quotes, or   coming-soon announcements.

    Usability.gov guidelines include:

·         Minimize page download time by reducing bytes per page. Provide feedback when users must wait.
·         Avoid displaying unsolicited windows or graphics (Ahmadi, 2000 cited in Usability.gov).
·         Standardize task sequences and reduce users workload by making use of technology – eg add a calculator.
·         Increase website credibility with links, FAQs, articles with citations and references, provide archive posts, etc. (Fogg, 2002 and Nielsen, 2003 cited in Usability.gov).
·         Use users’ terminology in help documentation (Scanlon and Schroeder, 2000 cited in Usability.gov)
·         Format information for reading and printing so that readers may print off content for long articles which involve tedious scrolling (Shaikh and Chaparro, 2004 cited in usability.gov).

Above all, prototyping, interaction design, information architecture and visual design are to be considered for optimized user experience. As Nielsen (2009) described it, web usability is really a ‘matter of balance’.

Related readings

User Experience and the iPhone – 7 user experience lessons from the iphone
Usability.gov – A US government web-design guideline for developing usable and useful Web sites


Reference

Usability.gov n.d., US Department of Health and Human Services, Washington DC, viewed 16 October 2010, <http://www.usability.gov/pdfs/chapter2.pdf>

Nielsen, J 2009, Anybody can do usability, Jakob Nielsen’s Alertbox 21 December 2009, viewed 17 October 2010,  <http://www.useit.com/alertbox/anybody-usability.html>

Smith, M 2010, 18 Dos and Don’ts of Usability on the Web, SpyreStudios, 3 May 2010, viewed 16 October 2010, <http://spyrestudios.com/dos-and-donts-of-usability/>



Saturday, October 16, 2010

Designing for Print versus Designing for Online



As Nielsen (1999) proclaimed, ‘anything that is a great print design is likely to be a lousy web design.’ I have made a summary of some key points to note when designing for each genre as highlighted by Nielsen (1999, 2008):


PRINT

ONLINE
Superior type and image quality. High resolution graphics possible.

Low resolution graphics and limited type availability due electronic format limitations and browser compatibility.
Users ‘read’ the publication.
Users ‘scan’ the publication.
Navigation - Simple user interface - i.e. page-turning in cases where article unusually exceed allotted canvas area –a full page or double-spread allows full capture of article.
Navigation - Scrolling required sometimes right from the start. Hypertext navigation to lead to links for further reading, subject to information architecture.

A canvas experience
-      Full-page newspaper or large magazine layout possible
An electronic document experience
-      Limited to the size of the computer screen
2-dimensional
1-dimensional & N-dimensional
Longer text, full sentences and details are possible with linear content, allowing storytelling.
Shorter text, fragmented sentences owing to reader eye-fatigue and typical impatience of web-users. A solution-hunting, actionable content model.
Immediate access to article.

Access is slowed down by download speeds and internet connectivity. But all these can be improved with technology advances.
Static elements. Lacks user interactivity.

Non-static. Its multimedia elements and overlays enhance user engagement and interactivity.
Creative headlines and titles are used frequently as teasers to draw audience in to read further.
Reliant on plain keywords and highlighted text to enhance Search Engine Optimization (SEO) utility.

The differences in designing for print and designing for online meant different design approaches should be taken to utilize the strengths of each medium and minimize its weaknesses. Agree wholeheartedly with Nielsen (1999) that the differences should be respected and relished!   
Related reading:

References

Nielsen, J 1999, Differences between print design and web design, Jakob Nielsen’s Alertbox, 24 January 1999, viewed 15 October 2010, <http://www.useit.com/alertbox/990124.html>

Nielsen, J 2008, Writing style for print vs. web, Jakob Nielsen’s Alertbox, 9 June 2008, viewed 15 October 2010, <http://www.useit.com/alertbox/print-vs-online-content.html>