Photobooth at OSU dinner party

Blog 3: BOOM BOOM Booth

Blogs

1. Design a web site about something that you like. Describe exactly who the anticipated audience is, and how the particular characteristics of this audience will affect the design and implementation of your web site. 

A little background of my business

My partner and I have been operating Ool Photo for a couple of years from Singapore to Brisbane. Ool Photo is a photography business that has its primary focus mainly on weddings and events. In every event that we have attended, we realised that there is a big shift in focus from photographing the leading “actors and actresses” with passive audiences watching, to the audiences actively participating in the celebration itself. That’s when live photography and photobooths started springing up. It becomes mandatory that every bride would love to hire a good photographer to capture the happiest days of their lives, and also a photobooth of some sort to entice their loved ones to share the joy with them. This definitely make weddings and other events more enjoyable for both groups of people.

Our first photobooth was actually held in my house. I was organizing a Chinese New Year (CNY) celebration during my summer holidays before my new semester started in March this year. I was just casually suggesting this idea to my friends who are in the same age group as me (between 20-30), and to my surprise, they’re more excited than I am. We did some quick research on photobooth props and backgrounds and we started cutting shiny sheets of paper. Since the theme is Chinese New Year, we decided to cut out pineapples and some Chinesey banners that you guys can’t really read, and of course the standard props like the spectacles and the hat. Red and gold is the theme since they’re extremely auspicious and bring us prosperity (that’s what the elders said).

We have a very receptive response, though we realised that there’s some people who do not really like to be photographed and was trying to escape from there!

CNY celebration

Celebrating our Chinese New Year with steamboat and photobooth!

We next held our photobooth during a lavish dinner party organised by the Overseas Singaporean Unit in Brisbane. Due to our innovative and overwhelming response during our private CNY party, one of my friends suggested to our Singapore Student Association (SSA, a student club for us) to let us hold this booth to bring up the mood (You do know events like this may be boring sometimes and the audiences can sneak out for some shots). Indeed, there were many crazy Singaporeans vying for the booth and taking some really hilarious photos of themselves (and the photographer). The age group is generally between 18 to 30 odd.

Photobooth at OSU dinner party

Crazy Singaporeans enjoying their time at the booth!

Photobooth at OSU dinner party

One shot isn’t enough. Another shot!

Photobooth at OSU dinner party

I’m sorry if you can’t read those English signboards. Or maybe they appear to be English

We also have this client who wants to have a photobooth for their kid’s birthday.

Kid's birthday

Even kids know how to act cool

Target audience

After holding some photobooths and experiencing the pros and cons, we decided to be serious and make this into the next big thing. Based on our experiences and those of our competitors, we have classified our target audience to be in these groups.

  • Wedding couples
  • Birthdays (kids, teenagers, adults)
  • The event planners
  • Corporate events

The age group that we’re looking at is between 20-40 years old because these people fall under the working adult section (having a disposable income to pay for extra services).We’re looking more at females as females are more excited about photos and keeping fond memories. Most of the time, the brides will be taking care of the photos rather than the groom. These people are also at a marriageable age, or they might already be parents and their kids are big enough to take part in birthday parties. There may be corporations that want to make their events more happening. And also event planners who want to engage various services. Currently, we’re looking at both the Brisbane and the Singapore market.

Our objectives

Instead of being ANOTHER photobooth, we strive to be a little different. From our market research, we found out that many photobooths are manned by not-so-exciting-and-lovable photographers or self-operated photobooths with cookie-cutter props. Hence, we decided to DIY our own props or source for interesting and unconventional props which will make a huge difference to our competitors. We will also come up with unconventional themes and exotic backgrounds that fit different events. We can produce studio quality, vintage and glamorous look, provide unparalleled customer service, and yet still affordable for our mid-income clients. Our only aim is to make the event fun and unforgettable. What we are selling is not only the photos, but also the experience with the photographer.

Our competitors

One Eye Click Live

Mid quality, expensiveOne Click Eye Live

Seven Ink

Low quality, cheap

7 ink

 

Epic Exposure Photobooths

Self-operated, cheap

Epic Exposure Booths

Joe Elario Photography

High end, expensive

 John Elario Photography

 

Our identity and image

We want to show our target audience that we’re fun, funny, creative and quirky. We want to attract people who are fun-loving, daring and love taking photos. We decided to use T-rex as our logo (since dinosaurs are our favourite animal) and call it BOOM BOOM Booth. My photographer loves to say “3-2-1-BOOM”, and hence the inspiration for the name. Our slogan will be “We will rock you”. And therefore, our website should be nothing too serious, have a few illustrations of the adorable dinosaur, an easy to navigate website which shows links to photo albums, contact details and about us, and most importantly, it must exude a feeling of fun and enjoyable.

2. Construct blueprint diagrams illustrating the structure by which a user will interact with your web site’s components.

BOOM BOOM Booth sitemap

A sitemap of how BOOM BOOM Booth is like

3. Create a series of low/medium fidelity wireframes for the main pages of the web site.

Home page

Home page

Since our website is all about photos and fun, we have to set the mood in the home page. The photos have to be engaging in order to lure potential customers to continue navigating the site. In order to minimise visual disruptions, I’ve placed the logo on one side and a menu icon on the right, whereby the menu will slide in when the icon is clicked. This saves quite a lot of clutter from the home screen.

Home page menu slide in

Home page menu slide in

A neat way of displaying the global navigation menu which involves links to main pages and the search navigation.

Gallery page - by date

Gallery page – by date

Putting photos into albums make things more organised and easy to browse. These albums are sorted in various ways: Title, Date, Location and Category type. There’s a local search navigation that searches for albums only.

Gallery page - by title

Gallery page – by title

Gallery page - by location

Gallery page – by location

Gallery page - search gallery

Gallery page – search gallery

Album photo gallery

Album photo gallery

Clicking into the album brings users to a photo slideshow where users can have a general browse through specific events. There’s also a local navigation system that brings users between albums.

4. Design a metadata matrix that presents the vocabulary terms and relationships. You need only present accepted and variant terms in an accompanying controlled vocabulary database.

Metadata Matrix

Vocabulary Description Examples Maintenance
Photo Booth A small partitioned enclosure for photographing Mobile photobooth, DIY photobooth Moderate
Gallery A place to view photos Web gallery, online gallery Easy
Album A collection of photos Photo album Easy
Prop An object used in posing for photos Hats, moustache, crown, lips High
Backdrop A setting for the photobooth Wall patterns, curtains, barricades High
Slideshow A series of photo slides Photo gallery Easy
Printing A production of photographs Photo printing Moderate
Blog A weblog Blogging of recent events Moderate
Portfolio A collection of best photography works Photography portfolio Easy
Category Classifying albums into different genres Birthday, Wedding, Event Easy
Sort Sort albums chronologically, geographically or alphabetically Sort by date, location or title Easy
Services Photobooth and photo printing services Setting photobooths during events, printing photos Moderate
FAQ A list of questions that clients usually ask How much, What props do you have High
Archives A backlog of all blog posts Joshua’s 9th Birthday Moderate
About About our company How our photobooth comes about Moderate
Contact Call/Email Photobooth hire enquiry, rates, availability Moderate

Controlled Vocabulary

Accepted terms Variant terms
Prop Props, moustache, beard, crown
Photo Booth Photobooth, photobox
Backdrop Background, wallpaper
Gallery Photo gallery, album gallery
FAQ Frequently Asked Questions

As photography has become so prevalent these days, many people are familiar with photography terms. Photography is also a trend, and whenever new trend comes in, the general crowd will pick up these terms fast. Words like photobooth, props and backdrops are nothing new. They have simply been placed in the context of photography. I find it a little tough to come up with variant terms because these words are already in its simplest and can hardly be replaced with other terms. As my clients will mostly be the younger generation (between 18-40), they will be familiar with these terms and the hype, and it should not pose them any problems trying to understand what we do before booking a service with us.

Blog 2: Role of Information Architect, Labelling Systems and Navigation Systems

Blogs

1. Define what Information Architecture is, and describe what role an Information Architect plays in the development of a web site. Be sure to use images if possible and provide references to the literature. (Minimum of 500 words.)

Define IA

Information Architecture can be defined as:

  • The structural design of shared information environments.
  • The combination of organization, labeling, search, and navigation systems within web sites and intranets.
  • The art and science of shaping information products and experiences to support usability and findability.
  • An emerging discipline and community of practice focused on bringing principles of design and architecture to the digital landscape.

The diagram below explains very simply what Information Architecture is and how it connects people to the content.

explaining the meaning of ia

Explaining the meaning of IA

Role of Information Architects

Information Architects are generally the “master planner” of websites. They define what the site will actually be and how they will work. According to Information Architecture for the World Wide Web, an Information Architect

  • Clarifies the mission and vision for the site, balancing the needs of its sponsoring organization and the needs of its audiences.
  • Determines what content and functionality the site will contain.
  • Specifies how users will find information in the site by defining its organization, navigation, labeling, and searching systems.
  • Maps out how the site will accommodate change and growth over time.
role of information architect

Role of Information Architect

Information Architects do not work alone. They have to work with other people such as the web designer, UX designer and the UI designer to plan the layout and structure of the website. Sometimes, they have to assume more than 1 role. Like a building architect, the Information Architect needs to define a strong infrastructure for the website to house the content so that users are able to navigate their way through and find what they need. They have to develop content categorisation schemes, consistent site terminology, content structure across the site and site architecture diagrams. And therefore, Information Architects are normally involved very early in the design process.

A good Information Architecture is one that is not obvious in a website. They are normally invisible to users. However, if the Information Architecture is badly structured, it will become very obvious to users and they will start complaining about issues such as difficulty in navigating from page to page, unable to look for the answers that they need, and so on. It is just like the supermarket featured below. There are no proper labelling of the items and it becomes time consuming looking for something that you need, like a tray of eggs. Since Information Architecture cannot be seen, it is very difficult to judge how good the IA is. Some people will even doubt the need to hire an Information Architect.

bad IA

An example how bad Information Architecture looks like. It’s like a supermarket without proper labelling for its items.

Nevertheless, Information Architecture is very important in every website. Without IA, you will not be able to imagine how much time, money and effort will be wasted on your website. Rosenfeld and Morville have provided some reasons for the importance of effective information architecture:

  • The cost of finding information
  • The cost of not finding information
  • The cost of construction
  • The cost of maintenance
  • The cost of training

Let’s take the second point as an example. What are the consequences if your users cannot find information in your website? Imagine the frustration caused to your clients trying to find out how to purchase a product from your e-commerce site. You will lose a customer. Not only that, your customer may send a feedback to you about the inconveniences caused to him. Since you would not want to lose any more potential customers, you will look for your web developer to work on the problem. More money will be spent for your web developer to rectify the problem, and during the meantime, you will still be losing customers until the maintenance is completed. This process is not efficient at all.

2. Take a screen capture of the main page of web site of your own choice and post it on your blog.

sean wes handlettering

Sean Wes Handlettering

a) Create a table describing the navigational labels.

Label Destination’s heading label Destination’s <TITLE> label
Top-of-page navigation system labels
About About About
Contact Contact Contact
Login Login form Login
Lettering Hand lettering resources & education Lettering
Business Make a living with your passion Business
Body navigation system labels
Get my book for free
Hand lettering classes Make a living as a hand lettering artist Learn lettering
Podcast Seanwes podcast Seanwes podcast
Community The community Community
Lettering blog Blog Lettering
Business blog Blog Business
Store store Seanwes store
Bottom-of-page navigation labels
Learn lettering Make a living as a hand lettering artist Learn lettering
Gallery Gallery Gallery
Resources Resources Hand lettering pens, pencils and brushes
Blog Blog Lettering
Store Store Seanwes store
Community The community Community
Blog Blog Business
Podcast Seanwes podcast Seanwes podcast
Books Pursue your passion full-time The overlap technique
Resources Resources Resources
About About About
Contact Contact Contact
Login Login form Login
Get my free book
Search

b) Describe what labels you do not like and why, and suggest improvements.

This website is very short and sweet with a very clear labelling throughout the whole site. There isn’t much to pick on. What could have improved will be his primary navigation. I suppose seeing the ‘business’ label might look a little weird to you who don’t know about Sean Wes at all. I knew about him when I was searching online to learn how to do hand lettering and I found him (he has the best SEO when I looked for the keyword ‘hand lettering tutorials’). Even before his website was published, he had made plenty of promotional videos to keep in touch with us and to tell us about his plans after he had his website up. Therefore, I already have some clue what he meant by that. Nevertheless, I was still confused what that label was at first till I click in to see.

seanwes primary navigation

Seanwes Primary Navigation

I can see that he’s trying to keep his labels very short and neat, using only 1 word for every label. It’s very consistent – ‘about’, ‘contact’, ‘login’, ‘lettering’, ‘business’. He’s actually trying to make a distinct 2-part website with lettering and business as the main focus.Only after clicking into ‘lettering’ or ‘business’ will you see the secondary navigation which gives a clearer idea about his main topic.

seanwes lettering subsite secondary navigation

seanwes lettering subsite secondary navigation

seanwes lettering business subsite secondary navigation

seanwes lettering business subsite secondary navigation

Instead of putting these 2 labels side by side, he could possibly use the secondary navigation of lettering (‘learn lettering’, ‘gallery’, ‘resources’, ‘blog’, ‘store’) to be his primary navigation, and put business either at the far end of the primary navigation, or in the footer. I’m suggesting this because I felt that the business label should be his side topic instead of his main topic, since I come to this side to find out more about how to do hand lettering and not to do a business with hand lettering. Of course, there might be other ways to argue about this.

c) Describe whether there are any inconsistencies in the labelling system between the pages.

Style

There’s a consistent style throughout. The labels are all in lower case, that’s similar to the logo.

Presentation

The home page is in monochrome and thus the colours for the labels are in black, white and grey only. The same typeface, ‘lemonde-courrier’, is used for all the labels, in fact, for the whole website (I don’t really like that, it shows no distinction between the labels and the rest of the page). The headings are in sentence case and bold to show sections within the page.

The presentation remains consistent throughout the pages, except that for the ‘lettering’ page, the main colour is green, while the ‘business’ page is blue. This is also reflected in the footer whereby the ‘lettering’ and ‘business’ headings are underlined by the respective colours.

seanwes footer

seanwes footer with coloured labellings

There’s a very distinctive difference in the font sizes for the ‘about’, contact’ and ‘login’ compared to the ‘lettering’ and ‘business’, also for the headings within the body.

Syntax

All the labels are noun-based.

Granularity

The labels are equal in their specificity

Comprehensiveness

The labels are comprehensive

Audience

Very simple usage of nouns for the labels, easy to understand for any kind of audience.

d) Describe what type of navigation is used?

An embedded navigation system is used. This website consists of the global and contextual navigation system on the main page. The local navigation system can only be seen after you click into either ‘lettering’ or ‘business’. These navigation systems are integrated within the web pages. They are wrapped around and infused within the content of the site. They provide both context and flexibility, helping users understand where they are and where they can go.

seanwes primary navigation

Seanwes Primary Navigation

The global navigation system in this website is referring to these labels: ‘about’, ‘contact’, ‘login’, ‘lettering’ and ‘business’. The logo found together with these labels links back to the home page. They are present on every page throughout the site, usually on the top of the website. They are the only consistent navigation in the site and serves as an indication telling where you are right now.

seanwes lettering subsite secondary navigation

seanwes lettering subsite secondary navigation

The local navigation system is embedded within the subsites ‘lettering’ and ‘business’. It forms a horizontal line just beneath the primary navigation and the selected label will be indicated by a different colour (grey against the other black labels). The local navigation of ‘lettering’ is very different to those of ‘business’.

contextual navigation

Contextual Navigation

The contextual navigation system lives within the body of the website. Some of these are ‘hand lettering classes’, ‘lettering blog’ and ‘listen resources’. Contextual navigation supports associative learning. It allows you to create a web of connective tissue that benefits users and the organisation.

e) Describe what type of search system is used?

The search system used is ‘Index by Topic’. Seanwes is a very simple website. It’s not like Griffith Uni where there is a large volume of content and various target audiences. The search bar located at the bottom of the page allows users to key in any keywords that matches the words in any of his posts or pages. For eg, I want to search for the keyword ‘typography’. I put in this keyword and the website simply searches for those articles with the keyword ‘typography’ in it.

3. Examine at least two other similar or competing web sites and undertake the following tasks:
a) Provide screen shots of these competing web sites.

the australian graphic supply co

The Australian Graphic Supply Co

hand lettering tutorial

Hand Lettering Tutorial

b) Describe how similar the labelling systems are?

Style

Consistent usage of punctuation and case.

the hand lettering tutorial — primary navigation system

The Hand Lettering Tutorial — Primary Navigation System

the agsc — primary navigation system

The AGSC — Primary Navigation System

Presentation

Consistent application of fonts, font sizes, colours, whitespace, and grouping.

Syntax

Consistent noun-based labels for primary navigation systems.

Granularity

The labels are equal in specificity.

Comprehensiveness

The labels are comprehensive.

Audience

Usage of terms is consistent with the audience.
c) State whether you think any particular site is clearly the winner (and if so, why)?

I think that Seanwes is the winner. Simply because I always know where I am in the site. Seanwes shows where I am by indicating a different colour for the label. It even indicated that I’m in the ‘lettering’ subsite with a green background for the primary navigation, making it hard to miss. But comparing to Hand Lettering Tutorial and The AGSC, both of them do not show distinction in their labelling though they have indicated the current location through the page heading and the <TITLE>.


 

References:

http://webstyleguide.com/wsg3/1-process/2-development-team.html

http://room34.com/philosophy/roles

http://www.uxbooth.com/articles/complete-beginners-guide-to-information-architecture/

Morville, P & Rosenfeld, L 2007, Information Architecture for the World Wide Web, Third Edition, O’Reilly.

Blog 1: Information seeking, Classification and Organisation

Blogs

1. Use the pearl growing method for information seeking to search for information about “Electronic Record and Documents Management” and “Digital Asset Management”. 

a) Describe what you found/learnt about “Electronic Record and Documents Management” and “Digital Asset Management”.

Electronic Document and Record Management System, which is abbreviated as EDRMS, is a form of content management system that holds all online or offline documents and records within the system as digital documents. With this integrated system, organisations will be able to easily manage their documents and records till the end of the document life-cycle.

Digital Asset Management (DAM) basically refers to the management of digital assets. Digital assets are generally images, graphics, logos, animations, audio and video clips, and any other useful digital files. Digital files are termed as assets only when ‘its environment contains additional information outside of the file’. In short, “it is any form of media that has been converted into an electronic (binary) format that has a ‘value’ to a company”. There exists many companies that offer DAM to users, such as Adobe.

Comparing the definitions of these two content management systems, it seems that they both possess similar functionalities. However, DAM is more likely a subset of EDRMS, whereby it only manages digital media, while EDRMS manages everything under the sun, from paper to digital.

The benefits associated with EDRMS are also quite different from that of DAM. For example, EDRMS helps to ‘remove paper from the records management cycle’ and ‘eliminate redundant and duplication of paper’, as nowadays, organisations are moving towards a paperless working environment. Whereas, DAM targets mostly at individuals such as photographers. They promote this system as helping creative individuals to be time-efficient and create a proper filing system for their photos.

b) Describe your experience with using the pearl growing method and the processes you undertook.

As a habit, when I want to find out more information about a certain topic, I’ll always use Google as my preferred search engine and input the exact keyword. In this case, it’s ‘Electronic Record and Document Management System’. When the search results are out, I realized that there’s actually an abbreviation for it. Also, it seems like it’s a standard to call it ‘Electronic Document and Record Management System’ rather than the other way around. However, the meaning of the term did not change so it didn’t really matter to me. I always start with reading the Wikipedia since it is able to give me a general idea of what I’m going to expect since I’m totally new to this term. After getting a rough idea, I proceed to read the next few links, I read the short metadata description below, and the kind of information I get is who uses EDRMS, why they use it, what benefits they can get from it. And of course, the different kinds of softwares that are available that can cater to large organisations.

When I have reached the bottom of the page, there are the related searches and page numbers. Since I felt that the information is kind of similar, I decided to deviate a little by looking at other searches related to my current search.

Likewise for DAM, I executed a similar approach to learn more about the content management system and made a comparison between the both of them as I’m curious whether they are similar systems catering to similar target audiences or something different.

2. Arrange the following list in alphabetical order then answer the questions below. You should look to the literature and existing theory to justify your answers.

  • El Paso, Texas
  • Saint Nicholas, Belgium
  • The Lord of the Rings
  • Newark, New Jersey
  • XVIIme siècle
  • .38 Special
  • 1001 Arabian Nights
  • The 1-2-3 of Magic
  • Albany, New York
  • #!%&: Creating Comic Books
  • St. Louis, Missouri
  • The Hague, Netherlands
  • $35 a Day Through Europe
  • H20: The Beauty of Water
  • Plzen, Czech Republic
  • New York, New York

Arranged in alphabetical order:

  • #!%&: Creating Comic Books
  • $35 a Day Through Europe
  • .38 Special
  • The 1-2-3 of Magic
  • 1001 Arabian Nights
  • XVIIme siècle
  • Albany, New York
  • El Paso, Texas
  • H20: The Beauty of Water
  • The Lord of the Rings
  • New York, New York
  • Newark, New Jersey
  • Plzen, Czech Republic
  • Saint Nicholas, Belgium
  • St. Louis, Missouri
  • The Hague, Netherlands

a) Did you put ‘The Hague’ under T or H? Why?

T, because initial articles in place names are generally retained (The Hague is the seat of government in Netherlands).

b) Did you put ‘El Paso’ under E or P? Why?

E, because my readers are English-speaking, they might not know that ‘El’ means ‘The’ in Spanish. They are likely to think of these titles with the articles, therefore it is acceptable to alphabetise under the article.

c) Which came first in your list, ‘Newark’ or ‘New York’? Why?

New York, because the space takes on a higher precedence than symbols, numbers or letters.

d) Does ‘St. Louis’ come before or after ‘Saint Nicholas’? Why?

It depends. There’s 2 ways of sorting these: word-by-word or letter-by-letter. If you’re sorting word-by-word, St. Louis will come before Saint Nicholas. If you’re sorting letter-by-letter, then Saint Nicholas will come before St. Louis. St. is technically only an abbreviation of Saint. Users tend to sort via word-by-word because it keeps headings with the same word or phrase together. However, in the Chicago Manual or other style guides, letter-by-letter is the preferred system as people are already familiar with it because this system is used in most dictionaries and encyclopaedias. In my case, I’m sorting word-by-word.

e) How did you handle numbers, punctuation, and special characters?

I refer to the ASCII code. Punctuation comes first, followed by numbers then special characters. In this case, ‘#’ comes before ‘$’ and ‘$’ comes before ‘.’, and that’s how I derived the order. And also, “The 1-2-3 of Magic” comes before ‘1001 Arabian Nights’ because ‘-‘, which is a punctuation, has a higher precedence than numbers, in this case ‘0’.

ASCII Code

Demonstrate the order of precedence in ASCII Code

f) Assuming the italicised terms are book titles, what might be a more useful way to organise this list?

If they are book titles, we can organise them according to the Dewey Decimal System. “#!%&: Creating Comic Books” is most likely a non-fiction book falling under 740 Drawing and “H20: The Beauty of Water” may fall under 610 Medical Science. These books will be further classified into more specific categories and also by authors.

g) If the cities represent places you’ve visited and the book titles are ones you’ve read, how could chronology be used to order the list in a more meaningful way?

I would sort them chronologically (year, month, date) from the latest to the oldest, then by the titles alphabetically if they happened to be read on the same date.

Eg 1:

  • 2014-08-13     Newark, New Jersey
  • 2014-07-22     Albany, New York
  • 2014-07-13     The Hague, Netherlands
  • 2014-06-03     Plzen, Czech Republic
  • 2014-06-03     St. Louis, Missouri
  • 2014-06-02     Saint Nicholas, Belgium
  • 2014-04-11     New York, New York
  • 2014-03-12     El Paso, Texas

Also, I can first group these countries geographically into US and Europe and work out the chronology.

Eg 2:

US

  • 2014-08-13     Newark, New Jersey
  • 2014-07-22     Albany, New York
  • 2014-04-11     New York, New York
  • 2014-03-12     El Paso, Texas

Europe

  • 2014-07-13     The Hague, Netherlands
  • 2014-06-03     Plzen, Czech Republic
  • 2014-06-03     St. Louis, Missouri
  • 2014-06-02     Saint Nicholas, Belgium

Eg 2 will be a better way of representing since I’ll know which countries in US or Europe have I conquered.

3. Seek out and provide screen shots of web sites that are examples for each of the following organisation schemes:

a) Topic/Subject

smashing magazine

This demonstrates a topic-oriented website by classifying web design topics into coding, design, mobile, graphics, etc.

Smashing Magazine is basically a magazine that discusses about anything web and design related. They have a wealth of information and it’s important to categorise them according to topics so that readers can access the information easily.

b) Task

marcella custom

This demonstrates the involvement of users to follow a set of tasks to do something, in this case, customising a shirt

Marcella Custom organises its content into a collection of tasks. The designer designed the website in a way that the users can choose to customise the looks of the shirt via patterns, collars, sleeves and buttons.

c) Audience

griffith university home page

Using Griffith Uni’s home page as an example of how students navigate through the website to look for their course resources. This demonstrates an audience-oriented website.

Griffith University has defined 6 types of audiences who will visit their sites — future students, current students, international students, staff, research and alumni. Each section in the menu leads to a smaller, audience-specific mini-site that presents only information that is of particular interest to that segment of audience.

d) Metaphor

vintage patisserie

Vintage Patisserie is a metaphoric website. They made use of all those vintage illustrated elements such as the 70s lady, the rabbit and the fireplace to portray a vintage feel

The use of the 70s lady, the rabbit, brick-wall fireplace, the vintage suitcases and telephone helps us to understand the new by relating it to the familiar.

e) Hybrid

facebook

Facebook as a hybrid organisation scheme

Facebook looks very complex as it consists of many organisation schemes put together. There’s the search function, an audience-oriented scheme and a topical scheme. It takes time to get used to this layout, but once you’re familiar with it, you’ll be able to navigate around easily. It is one of those successful organisation schemes that works well with many people. However, users are normally not satisfied when Facebook decided to change it’s layout like the timeline or changing the notifications, messages and friend requests from the left to the right.


References

  1. Vision and Beyond
  2. Nature Photographers
  3. Widen
  4. Enterprise Content Management
  5. Martin Tulic
  6. The Chicago Manual of Style Online

Week 3: Navigation and Labelling Systems

Exercises

1. What is the goal of a label?

Labelling is a form of representation. It is performed in conjunction with grouping and is part of the process of organising. The goal of a label is to communicate information effectively by triggering the right association in the user’s mind and to communicate efficiently; that is, to convey meaning without taking up too much of a page’s vertical space or a user’s cognitive space.

2. Why is labelling an important aspect of web site design?

Prerecorded or canned communications are very different from interactive real-time communications. When we talk with another person, we rely on constant user feedback to help us hone the way we get our message across.

Unfortunately, when we “converse” with users through the web sites we design, the feedback isn’t quite so immediate, if it exists at all. There are certainly exceptions—blogs, for example—but in most cases a site serves as an intermediary that slowly translates messages from the site’s owners and authors to users, and back again. This “telephone game” muddies the message. So in such a disintermediated medium with few visual cues, communicating is harder, and labelling is therefore more important.

3. What are the aspects of a good labelling system?

To minimise this disconnect, information architects must try their best to design labels that speak the same language as a site’s users while reflecting its content. And, just as in a dialogue, when there is a question or confusion over a label, there should be clarification and explanation. Labels should educate users about new concepts and help them quickly identify familiar ones.

4. List and describe the types/varieties of labels.

URLs

Page Titles

The page name used can have a dramatic effect on the user’s understanding of a web site through the use of persuasive labels (verb-noun construct which serves as a call-to-action), 64 characters or less (W3C guidelines) and the appropriate use of capitalisation.

eg:

Order Luxury Business Cards Online

Luxury Business Cards –Order Business Cards Online

Luxury Business Cards –Order Luxury Business Cards Online

Textual Labels

  • Labels as Contextual Links: Hyperlinks to chunks of information on other pages or to another location on the same page

  • Labels as Headings: Labels that simply describe the content that follows them, just as print headings do

  • Labels as Navigation Systems Choices: Labels representing the options in navigation systems

  • Labels as Index Terms: Keywords, tags, and subject headings that represent content for searching or browsing.

Iconic Labels

Icons can represent information in much the same way as text can. We see them most frequently used as navigation system labels. The problem with iconic labels is that they constitute a much more limited language than text. That’s why they’re more typically used for navigation system or small organization system labels. Users might need to learn the meaning, and designers may need to provide accompanying textual explanations.

5. Why do index terms facilitate faster searching and make browsing easier?

The records we use to represent documents in content management systems and other databases typically include fields for index terms, which are often heard but not seen: they come into play only when you search. Similarly, index terms may be hidden as embedded metadata in an HTML document’s <META...> or <TITLE> tags. For example, a furniture manufacturer’s site might list the following index terms in the <META...> tags of records for its upholstered items:

<META NAME="keywords" CONTENT="upholstery, upholstered, sofa, couch, loveseat, love seat, sectional, armchair, arm chair, easy chair, chaise lounge">

So a search on “sofa” would retrieve the page with these index terms even if the term “sofa” doesn’t appear anywhere in the page’s text. Using index terms from controlled vocabularies or thesauri is a systematic approach to labelling.

6. Discuss the advantages and disadvantages of using iconic labels.

Pros

Iconic labels add aesthetic quality to a site, and as long as they don’t compromise the site’s usability, there’s no reason not to use them. In fact, if your site’s users visit regularly, the iconic “language” might get established in their minds through repeated exposure. In such situations, icons are an especially useful shorthand, both representational and easy to visually recognize—a double bonus.

Cons

Icons can represent information in much the same way as text can. The problem with iconic labels is that they constitute a much more limited language than text. That’s why they’re more typically used for navigation system or small organisation system labels, where the list of options is small, than for larger sets of labels such as index terms, where iconic “vocabularies” are quickly outstripped. Most users probably won’t understand the iconic labels immediately. They might need to learn the meaning. Designer may need to provide accompanying textual explanations for the icons.

7. What is the purpose of “scope notes”?

Scope notes are brief descriptions to describe navigational labels, normally to augment it when initially introduced on the main page.

8. How do homonyms and synonyms affect label design?

Homonyms: word that sound the same but have different meanings

Synonyms: different words that mean the same or a similar thing

Language is simply too ambiguous for you to ever feel confident that you’ve perfected a label. There are always synonyms and homonyms to worry about, and different contexts influence our understanding of what a particular term means.

9. Why is it important to be consistent when designing a labelling system?

Consistency means predictability, and systems that are predictable are simply easier to learn. You see one or two labels, and then you know what to expect from the rest—if the system is consistent. This is especially important for first-time visitors to a site, but consistency benefits all users by making labeling easy to learn, easy to use, and therefore invisible.

10. Why is it better to have a narrower scope when designing labels?

If we focus our sites on a more defined audience, we reduce the number of possible perspectives on what a label means. Sticking to fewer subject domains achieves more obvious and effective representation. A narrower business context means clearer goals for the site, its architecture, and therefore its labels.

To put it another way, labeling is easier if your site’s content, users, and context are kept simple and focused. If you are planning any aspect of your site’s scope—who will use it, what content it will contain, and how, when, and why it should be used—erring toward simplicity will make your labels more effective.

If your site must be a jack of all trades, avoid using labels that address the entire site’s content. But in the other areas of labeling, modularizing and simplifying content into subsites that meet the needs of specific audiences will enable you to design more modular, simpler collections of labels to address those specific areas.

11. List and describe the key issues that affect the consistency of a labelling system.

Style

Haphazard usage of punctuation and case is a common problem within labeling systems, and can be addressed, if not eliminated, by using style guides.

Presentation

Consistent application of fonts, font sizes, colors, whitespace, and grouping can help visually reinforce the systematic nature of a group of labels.

Syntax

Within a specific labeling system, consider choosing a single syntactical approach and sticking with it.

Granularity

Within a labeling system, it can be helpful to present labels that are roughly equal in their specificity.

Comprehensiveness

Users can be tripped up by noticeable gaps in a labeling system. For example, if a clothing retailer’s site lists “pants,” “ties,” and “shoes,” while somehow omitting “shirts,” we may feel like something’s wrong. A comprehensive scope also helps users do a better job of quickly scanning and inferring the content a site will provide.

Audience

Consider the languages of your site’s major audiences. If each audience uses a very different terminology, you may have to develop a separate labeling system for each audience, even if these systems are describing exactly the same content.

12. What are the main sources of labelling systems?

Existing labeling systems might include the labels currently on your site, or comparable or competitors’ sites. Study, learn, and “borrow” from what you find on other sites. And keep in mind that a major benefit of examining existing labeling systems is that they’re systems—they’re more than odd, miscellaneous labels that don’t necessarily fit together.

Your site

A useful approach is to capture the existing labels in a single document. To do so, walk through the entire site, either manually or automatically, and gather the labels. You might consider assembling them in a simple table containing a list or outline of each label and the documents it represents.

Arranging labels in a table provides a more condensed, complete, and accurate view of a site’s navigation labels as a system.

Comparable and competitive sites

If you don’t have a site in place or are looking for new ideas, look elsewhere for labeling systems. Determine beforehand what your audiences’ needs are most likely to be, and then surf your competitors’ sites, borrowing what works and noting what doesn’t.

If you surf multiple competitive or comparative sites, you may find that labeling patterns emerge. These patterns may not yet be industry standards, but they at least can inform your choice of labels.

Controlled vocabularies and thesauri

These especially useful resources are created by professionals with library or subject-specific backgrounds, who have already done much of the work of ensuring accurate representation and consistency. These vocabularies are often publicly available and have been designed for broad usage. You’ll find these to be most useful for populating labeling systems used for indexing content. Seek out narrowly focused vocabularies that help specific audiences to access specific types of content.

13. Create a labelling table for a web site of your choice. Comment on the quality of the labelling system. Are there any inconsistencies? How would you improve the labelling system?

To be updated soon!

14. What are the advantages of using controlled vocabularies and thesauri as a source for labelling systems? Provide some examples of controlled vocabulary and thesauri resources.

These especially useful resources are created by professionals with library or subject-specific backgrounds, who have already done much of the work of ensuring accurate representation and consistency. One advice is to seek out narrowly focused vocabularies that help specific audiences to access specific types of content.

15. Describe the three most important sources for creating a new labelling system.

Content analysis

Labels can come directly from your site’s content. You might read a representative sample of your site’s content and jot down a few descriptive keywords for each document along the way. There are software tools now available that can perform auto-extraction of meaningful terms from content. These tools can save you quite a bit of time if you face a huge body of content.

Content authors

Another manual approach is to ask content authors to suggest labels for their own content. However, even when authors select terms from a controlled vocabulary to label their content, they don’t necessarily do it with the realization that their document is only one of many in a broader collection. So they might not use a sufficiently specific label. And few authors happen to be professional indexers.

User advocates and subject matter experts

Another approach is to find advanced users or user advocates who can speak on the users’ behalf. Such people may include librarians, switchboard operators, or subject matter experts (SMEs) who are familiar with the users’ information needs in a larger context. Some of these people—reference librarians, for example—keep logs of what users want; all will have a good innate sense of users’ needs by dint of constant interaction.

16. What is meant by the term “subject matter expert”?

Subject matter experts (SMEs) should have special, in-depth knowledge from both a business and IT perspective that when shared with others, significantly enhances performance within the organization. They should bring real-world examples, best
practices, and tricks of the trade that will positively impact your business. They should be the go-to resource who helps resolve complex issues. Most importantly, they should be
able to hit the ground running once they understand your unique environment and work independently to deliver project tasks.

Source: https://www.shawsystems.com/information/fiveWaysSME.pdf

17. What is card sorting? Describe how card sorting can be useful for creating a labelling system.

Card sort exercises are one of the best ways to learn how your users would use information. There are two basic varieties of card sorts: open and closed.

Open card sorts allow subjects to cluster labels for existing content into their own categories and then label those categories (and clearly, card sorting is useful when designing organization systems as well as labeling systems).

Closed card sorts provide subjects with existing categories and ask them to sort content into those categories. At the start of a closed card sort, you can ask users to explain what they think each category label represents and compare these definitions to your own.

18. What is meant by the term “folksonomic tagging”?

Folksonomies also known as social tagging, are user-defined metadata collections. Users do not deliberately create folksonomies and there is rarely a prescribed purpose, but a folksonomy evolves when many users create or store content at particular sites and identify what they think the content is about.

Source: http://www.gartner.com/it-glossary/folksonomy/

19. What is search log analysis? Why is it useful/important?

Analyzing search queries is a great way to understand the types of labels your site’s visitors typically use. These are the labels that users use to describe their own information needs in their own language. You may notice the use (or lack thereof) of acronyms, product names, and other jargon, which could impact your own willingness to use jargony labels. You might notice that users’ queries use single or multiple terms, which could affect your own choice of short or long labels. And you might find that users simply aren’t using the terms you thought they would for certain concepts. You may decide to change your labels accordingly, or use a thesaurus-style lookup to connect a user-supplied term.

20. What is an embedded navigation system? What are the three types of embedded navigation systems?

Navigation systems are composed of several basic elements, or subsystems. First, we have the global, local, and contextual navigation systems that are integrated within the web pages themselves. These embedded navigation systems  are typically wrapped around and infused within the content of the site. They provide both context and flexibility, helping users understand where they are and where they can go.

21. What is a supplemental navigation system? What are the three types of supplemental navigation systems?

We have supplemental navigation systems such as sitemaps, indexes, and guides that exist outside the content-bearing pages. Similar to search, these supplemental navigation systems provide different ways of accessing the same information. Sitemaps provide a bird’s-eye view of the site. A to Z indexes allow direct access to content. And guides often feature linear navigation customized to a specific audience, task, or topic.

22. Describe the main types of built-in web browser navigation.

Open URL allows direct access to any page on a web site.

Back and Forward provide a bidirectional backtracking capability.

The History menu allows random access to pages visited during the current session, and

Bookmark or Favorites enables users to save the location of specific pages for future reference.

Web browsers also go beyond the Back button to support a “bread crumbs” feature by color-coding hypertext links.

By default, unvisited hypertext links are one color and visited hypertext links are another. This feature helps users see where they have and haven’t been and can help them to retrace their steps through a web site.

As the user passes the cursor over a hypertext link, the destination URL appears at the bottom of the browser window, hinting at the nature of that content.

23. What are some of the ways designers override or corrupt browser-based navigation?

The most common design crimes are:

  • Cluelessly modifying the visited/unvisited link colors
  • Killing the Back button
  • Crippling the Bookmark feature

24. Apply the navigation stress test to two different web sites and describe your findings.

To be updated soon!

25. Describe the purpose and key features of a global navigation system.

A global navigation system is intended to be present on every page throughout a site. It is often implemented in the form of a navigation bar at the top of each page. These site-wide navigation systems allow direct access to key areas and functions, no matter where the user travels in the site’s hierarchy. Because global navigation bars are often the single consistent navigation element in the site, they have a huge impact on usability. Most global navigation bars provide a link to the home page. Many provide a link to the search function. Some provides contextual clues to identify the user’s current location within the site. It tells the user “what’s important”.

26. Describe the pros and cons of hypertextual navigation.

Pros

The Web’s hypertextual capabilities removed the limitations of hierarchical navigation, allowing tremendous freedom of navigation. Hypertext supports both lateral and vertical navigation. From any branch of the hierarchy, it is possible and often desirable to allow users to move laterally into other branches, to move vertically from one level to a higher level in that same branch, or to move all the way back to the main page of the web site. If the system is so enabled, users can get to anywhere from anywhere.

Cons

Hypertextual navigation allows users to be transported right into the middle of an unfamiliar web site. Links from remote web pages and search engine results allow users to completely bypass the front door or main page of the web site. To further complicate matters, people often print web pages to read later or to pass along to a colleague, resulting in even more loss of context.

27. Go to two large websites that support global and local navigation. Post screen shots of these two websites and highlight the navigation systems.

To be updated soon!

28. Describe the purpose of a contextual navigation system. Find two examples of web sites that use contextual navigation. Use these example to explain how contextual navigation supports associate learning.

Some relationships don’t fit neatly into the structured categories of global and local navigation. This demands the creation of contextual  navigation links specific to a particular page, document, or object. On an e-commerce site, these “See Also” links can point users to related products and services. On an educational site, they might point to similar articles or related topics. It can also be represented as inline hyperlinks.

In this way, contextual navigation supports associative learning. Users learn by exploring the relationships you define between items. They might learn about useful products they didn’t know about, or become interested in a subject they’d never considered before. Contextual navigation allows you to create a web of connective tissue that benefits users and the organisation.

29. Find an example of a web site that uses a sitemap as a supplemental navigation system. Critique the sitemap according to the design criteria outlined in the lecture notes.

To be updated soon!

30. Why is the level of granularity an issue when designing a web site index?

A major challenge in indexing a web site involves the level of granularity. Do you index web pages? Do you index individual paragraphs or concepts that are presented on web pages? Or do you index collections of web pages? In many cases, the answer may be all of the above. Perhaps a more valuable question is: what terms are users going to look for? The answers should guide the index design. To find those answers, you need to know your audience and understand their needs. You can learn more about the terms people will look for by analyzing search logs and conducting user research.

31. What is term rotation? Provide some examples of term rotation for a site index.

A useful trick in designing an index involves term rotation , also known as permutation. A permuted index rotates the words in a phrase so that users can find the phrase in two places in the alphabetical sequence. For example, in the Vanguard index, users will find listings for both “refund, IRS” and “IRS refund.” This supports the varied ways in which people look for information. Term rotation should be applied selectively. You need to balance the probability of users seeking a particular term with the annoyance of cluttering the index with too many permutations.

32. Find an example of a web site that uses a guide as a supplemental navigation system. Critique the guide according to the design criteria outlined in the lecture notes.

To be updated soon!

33. List and describe the advanced navigation approaches.

Personalisation and customisation

Personalisation involves serving up tailored pages to the user based upon a model of the behaviour, needs, or preferences of that individual (we guess what the user wants).

Customisation involves giving the user direct control over some combination of presentation, navigation, and content options (the user tells us what he wants).

Visualisation

Since the advent of the Web, people have struggled to create useful tools that enable users to navigate in a more visual way. First came the metaphor-driven attempts to display online museums, libraries, shopping malls, and other web sites as physical places. Then came the dynamic, fly-through “sitemaps” that tried to show relationships between pages on a web site. Both looked very cool and stretched our imaginations. But neither proved to be very useful.

Social navigation

On a more positive note, social navigation , built on the premise that value for the individual user can be derived from observing the actions of other users, continues to hold great promise and is already on the fast track to mainstream adoption.

34. Refer to Blog 3 in the assessment component of this course. Design a site map or index for your proposed web site.

To be updated soon!

Week 2: Anatomy of IA and Organisation Systems

Exercises

1. Why is it difficult for people to reward good IA?

  • The field is new, and many people don’t believe that things exist until they can see them.
  • The field is abstract, and many who might conceptually understand the basic premise of information architecture won’t really “get it” until they see it and experience it.
  • A well-designed information architecture is invisible to users

In short, IA is intangible. You can’t see it or feel it especially if the IA is done well. However, a bad IA will simply make life more difficult for users to navigate the site. Therefore, IA practitioners have to be “sales people” to explain the value behind a well-structured IA and the benefits.

2. Explain what is meant by “Top-Down IA”.

Top-Down IA attempts to anticipate users’ major information needs.

Let’s take Griffith University website as an example.

griffith university home page

Using Griffith Uni’s home page as an example showing how students navigate through the website to look for their course resources.

For most of us as current students, there are a few things that we want to find, such as the Griffith Portal, Learning@Griffith, Fees and Charges, etc. As for myself, I’ll usually disregard everything else on the website and go straight to “Current Students” in the main menu and look for “Learning@Griffith” and navigate my way to 3623ICT to check out the information that I want to find. The IA practitioner behind Griffith’s website already anticipated the tasks that we’re going to perform and set these step-by-step approach for us. Note that we go through a series of links to reach the destination.

Here is an example of how a Top-Down IA looks like in a flowchart

top-down IA

A flowchart depicting the structure of a top-down IA

3. What are some common questions a user has upon landing on a page on a web site?

  • Where am I?
  • I know what I’m looking for; how do I search for it?
  • How do I get around this site?
  • What’s important and unique about this organisation?
  • What’s available on this site?
  • What’s happening there?
  • Do they want my opinion about their site?
  • How can I contact a human?
  • What’s their address?

4. Explain what is meant by “Bottom-Up IA”. Why is Bottom-Up IA becoming increasingly important?

Bottom-Up IA embeds information architecture within the content.

Take my favourite website Smashing Magazine as an example. There’s a certain information structure existing here. I’m not referring to the primrary navigation menu, but the content itself. Notice how all the blog posts are structured in a certain way: The title, author, time, tags, comments and content.

dissecting smashing magazine

Dissecting Smashing Magazine to understand the IA within it.

Bottom-Up IA supports searching and browsing, the structure inherent in the content enables the answers to user’ questions to “rise” to the surface.

search in smashing magazine

Searching for ‘404 errors’ in Smashing Magazine.

search results in smashing magazine

Search results for ‘404 errors’ in Smashing Magazine. Notice how all the information I want about ‘404 errors’ in Smashing Magazine is found just by searching, and not by using the navigation menu.

This is bottom-up information architecture ; content structure, sequencing, and tagging help you answer such questions as:

  • Where am I?
  • What’s here?
  • Where can I go from here?

Bottom-up information architecture is important because users are increasingly likely to bypass your site’s top-down information architecture. Instead, they’re using webwide search tools like Google, clicking through ads, and clicking links while reading your content via their aggregators to find themselves deep in your site. Once there, they’ll want to jump to other relevant content in your site without learning how to use its top-down structure.

5. What is an organisation system?

Organisation system is the method of categorising information. The main ways of categorizing or grouping a site’s content (e.g., by topic, by task, by audiences, or by chronology). Also known as taxonomies and hierarchies. Tag clouds (based on user-generated tags) are also a form of organization system.

tag cloud

An example of an organisation system — the tag cloud

6. What is a site-wide navigation system? Provide a screenshot of an example.

breadcrumb

An example of a site-wide navigation system — breadcrumbs.

Primary navigation systems that help users understand where they are and where
they can go within a site (e.g., breadcrumbs).

7. What is a local navigation system? Provide a screenshot of an example.

local navigation system

An example of a local navigation system.

Primary navigation systems that help users understand where they are and where they can go within a portion of a site (i.e., a subsite).

8. What is a sitemap/table of contents? Provide a screenshot of an example.

sitemap

An example of a sitemap

Navigation systems that supplement primary navigation systems; provide a condensed
overview of and links to major content areas and subsites within the site, usually in outline form.

9. What are site indices? Provide a screenshot of an example.

sitemap

An example of a site indices

Supplementary navigation systems that provide an alphabetized list of links to
the contents of the site.

10. What are site guides? Provide a screenshot of an example.

Supplementary navigation systems that provide specialized information on a specific topic, as well as links to a related subset of the site’s content.

11. What are site wizards? Provide a screenshot of an example.

Supplementary navigation systems that lead users through a sequential set of steps; may also link to a related subset of the site’s content.

12. What is a contextual navigation system? Provide a screenshot of an example.

explaining contextual navigation

Look at how Wikipedia describes about Brisbane. There are many contextual links within.

explaining contextual navigation

Now, I click into ‘floodplains’ and I’m now ushered to a new page that tells me everything about floodplains

Consistently presented links to related content. Often embedded in text, and generally used to connect highly specialized content within a site.

13. What is a search interface? Provide a screenshot of an example.

search interface

An example of a search interface

search interface

A demonstration of how the search interface is used.

The means of entering and revising a search query, typically with information on how to improve your query, as well as other ways to configure your search (e.g., selecting from specific search zones).

14. What is a query language? List some Boolean operators and provide examples of queries using these operators.

The grammar of a search query; query languages might include Boolean operators (e.g., AND, OR, NOT), proximity operators (e.g., ADJACENT, NEAR), or ways of specifying which field to search (e.g., AUTHOR=“Shakespeare”).

15. What is a query builder?

Ways of enhancing a query’s performance; common examples include spell checkers,
stemming, concept searching, and drawing in synonyms from a thesaurus.

16. What is the purpose of a retrieval algorithm?

The part of a search engine that determines which content matches a user’s query; Google’s PageRank is perhaps the best-known example.

17. What are search zones?

Subsets of site content that have been separately indexed to support narrower searching (e.g., searching the tech support area within a software vendor’s site).

18. What are search results?

Presentation of content that matches the user’s search query; involves decisions of what types of content should make up each individual result, how many results to display, and how sets of results should be ranked, sorted, and clustered.

19. In terms of content, why are headings important?

Headings describe in short what your content will be about. This gives users a choice of clicking into the heading to read more or go on to look for other interesting topics.

20. What are embedded links?

Links within text; these label (i.e., represent) the content they link to.

21. What is embedded metadata?

Information that can be used as metadata but must first be extracted (e.g., in a recipe, if an ingredient is mentioned, this information can be indexed to support searching by ingredient).

22. In terms of content, what are chunks?

Logical units of content; these can vary in granularity (e.g., sections and chapters are both chunks) and can be nested (e.g., a section is part of a book).

23. What are sequential aids?

Clues that suggest where the user is in a process or task, and how far he has to go before completing it (e.g., “step 3 of 8”).

24. What are identifiers?

Clues that suggest where the user is in an information system (e.g., a logo specifying what site she is using, or a breadcrumb explaining where in the site she is).

25. What is meant by “invisible components” in IA?

Certain key architectural components are manifest completely in the background; users rarely (if ever) interact with them. These components often “feed” other components, such as a thesaurus that’s used to enhance a search query. Some examples of invisible information architecture components include:

  • Controlled vocabularies and thesauri
  • Retrieval algorithms
  • Best bets

26. What are controlled vocabularies and thesauri?
Predetermined vocabularies of preferred terms that describe a specific domain (e.g., auto racing or orthopedic surgery); typically include variant terms (e.g., “brewskie” is a variant term for “beer”). Thesauri are controlled vocabularies that generally include links to broader and narrower terms, related terms, and descriptions of preferred terms (aka “scope notes”). Search systems can enhance queries by extracting a query’s synonyms from a controlled vocabulary.

27. What is best bets?

Preferred search results that are manually coupled with a search query; editors and subject matter experts determine which queries should retrieve best bets, and which documents merit best bet status.

28. List some of the difficulties with organising information.

There are 4 challenges to classify information

  • Ambiguity

Classification systems are built upon the foundation of language, and language is ambiguous: words are capable of being understood more than one way. Take for example, how do you classify tomato? Is it a fruit, a vegetable or a berry? This ambiguity results in a shaky foundation for our classification systems. When we use words as labels for our categories, we run the risk that users will miss our meaning. Not only do we need to agree on the labels and their definitions, we also need to agree on which documents to place in which categories.

  • Homogeneity/Heterogeneity

Homogeneity refers to something composed of similar or identical elements.

For eg: the library card. It organizes and provides access to books. It does not provide access to chapters in books or collections of books. It may not provide access to magazines or videos. This homogeneity allows for a structured classification system. Each book has a record in the catalog. Each record contains the same fields: author, title, and subject. It is a high-level, singlemedium system, and works fairly well.

Heterogeneity refers to an object or collection of objects composed of unrelated or unlike parts.

For eg: websites. Web sites often provide access to documents and their components at varying levels of granularity . A web site might present articles and journals and journal databases side by side. Links might lead to pages, sections of pages, or other web sites. And, web sites typically provide access to documents in multiple formats (word, pdf, ppt, image archives, software files…). Each format has uniquely important characteristics. The heterogeneous nature of web sites makes it difficult to impose any single structured organisation system on the content. It usually doesn’t make sense to classify documents at varying levels of granularity side by side.

  • Differences in perspectives

Labeling and organisation systems are intensely affected by their creators’ perspectives. To design usable organisation systems, we need to escape from our own mental models of content labeling and organisation. This challenge is complicated by the fact that web sites are designed for multiple users, and all users will have different ways of understanding the information.

  • Internal politics

Because of the inherent power of information organization in forming understanding and opinion, the process of designing information architectures for web sites and intranets can involve a strong undercurrent of politics. Politics raise the complexity and difficulty of creating usable information architectures.

29. What is meant by the term “taxonomy”?

Taxonomy refers to a well-designed hierarchy.

the science or technique of classification.

— dictionary.com

30. What hierarchy is a natural way for humans to organise information?

Humans categorise information using these 2 organising methods: organisation schemes and organisation structures.

An organisation scheme defines the shared characteristics of content items and influences the logical grouping of those items.

An organisation structure defines the types of relationships between content items and groups.

31. List some design rules when designing a hierarchical organisation scheme.

hierarchical site navigation

This demonstrates how a hierarchical site navigation looks like

  • Keep balance between breadth and depth
  • Obey the 7 +-rule horizontally
  • No more than 5 levels vertically
  • Cross-link ambiguous items if really necessary
  • Keep new sites shallow

32. Describe the advantages and disadvantages of a hypertextual organisation structure.

hypertextual structure

This is how a hypertextual organisation structure looks like. Linking pages all over the site.

Hypertext is a highly nonlinear way of structuring information. A hypertext system involves two primary types of components: the items or chunks of information that will be linked, and the links between those chunks. These components can form hypermedia systems that connect text, data, image, video, and audio chunks. Hypertext chunks can be connected hierarchically, nonhierarchically, or both.

Although this organisation structure provides great flexibility, it presents substantial potential for complexity and user confusion. As users navigate through highly hypertextual web sites, it is easy for them to get lost. Without context, users can quickly become overwhelmed and frustrated. In addition, hypertextual links are often personal in nature. The relationships that one person sees between content items may not be apparent to others.

3 different methods to structure a website

A graph that shows you how you should structure your website based on the users’ knowledge of websites and the level of complexity you need present it.

33. What is social classification?

Web 2.0 sites enlist the users in content creation and classification. High profile successes such as Flickr and del.icio.us have sparked tremendous enthusiasm for tagging as a form of description and organisation.

We also see tagging in Instagram and Facebook in the form of #hashtags

instagram #hashtagging

How we use tagging now via Instagram.

34. What is meant by the term “folksonomy”?

Folksonomy is a system of classification derived from the practice and method of collaboratively creating and translating tags to annotate and categorise content.

Users tag objects with one or more keywords. The tags are public and serve as pivots for social navigation. Users can move fluidly between objects, authors, tags, and indexers. And when large numbers of people get involved, interesting opportunities arise to transform user behaviour and tagging patterns into new organisation and navigation systems.

hashtagging in facebook

Using Facebook as an example of how the community help to categorise information

Week 1: Introduction to Information Architecture

Exercises

1. What is information? Describe the qualities of information.

Information cannot be defined easily. However, it is not to be mixed up with data — facts and figures, relational databases — highly structured and produce specific answers to specific questions, knowledge — the stuff in people’s heads. Information lies in the middle. Information can be web sites, documents, software applications, images, and more.

2. What is the Dewey Decimal System? Describe how it operates.

The Dewey Decimal System is a tool to organise and provide access to the growing number of books. It is a hierarchical listing that begins with 10 top-level categories and drills down into great detail within each. It is made up of ten classes, each subdivided into ten divisions, each having ten sections.

dewey decimal system

The classification of books using the Dewey Decimal System in libraries. This image shows the 10 classes indicated in the hundreds starting from 000 and ending with 900, which will be further divided into 10 divisions and 10 sections.

dewey decimal system

This is an example to show how the 10 classes are divided into its sub-categories in the tens, eg under 100 Philosophy and Psychology, there’s 110 for Metaphysics, 120 for Metaphysical Theories and so on.

3. Explain what Library Science is.

Librarians have a long history of organising and providing access to information and are trained to work with searching, browsing, and indexing technologies.

Library and Information Science (LIS) is an interdisciplinary and multidisciplinary field that applies the practices, perspectives and tools of management, information technology and education and other areas of libraries. LIS also involves collection, organisation, preservation and dissemination of information resources and the political economy of information.

(Eno Joseph Ottong & Ubong Joseph Ottong, 2013, Teaching and learning for development through collaborative curriculum design: a study of University of Botswana, Botswana and University of Calabar, Nigeria)

 

4. What is information architecture?

  1. The structural design of shared information environments.
  2. The combination of organisation, labeling, search, and navigation systems within web sites and intranets.
  3. The art and science of shaping information products and experiences to support usability and findability.
  4. An emerging discipline and community of practice focused on bringing principles of design and architecture to the digital landscape.
IA visual summary

Summarising IA visually.

5. List and describe at least three reasons for why information architecture is important (i.e., the return on investment for hiring an information architect).

  1. the cost of finding information
    • time wasted trying to find out how to use the website or the intranet
    • frustration caused to clients using the website
  2. the cost of maintenance
    • the people who maintains your website will work more efficiently as they can find where to put in your new content and remove outdated content
  3. the value of brand
    • having a pretty website but not really useful in finding the information that users want will cause your brand to lose its value in people’s eyes while you are trying very hard to build your brand value.

6. List and describe the four key information architecture concepts that help information architects articulate user needs and behaviours.

  1. complex systems — understanding the interrelationship between the business context, the content and the users’ needs
  2. invisible work — allow users to complete tasks and find information without feeling that there is a complex system. What users see is a seamless interface.
  3. knowledge systems — organising and structuring information in an orderly and logical manner
  4. information seeking behaviour — understanding the users’ needs
key IA concepts

Key IA concepts

7. List and describe the three main information architecture systems that support a web site.

  1. searching systems — How we search information, e.g., executing a search query against an index.
  2. navigation systems — How we browse or move through information, e.g., clicking through a hierarchy.
  3. semantic networks — How we categorize information, e.g., by subject or chronology.

8. List and describe the four main information architecture deliverables.

  1. wireframes — they depict how an individual page or template should look from an architectural perspective. Wireframes stand at the intersection of the site’s information architecture and its visual and information design.For example, the wireframe forces the architect to consider such issues as where the navigation systems might be located on a page. And now that we see it on an early version of a page, does it seem that there are actually too many ways to navigate? Trying out ideas in the context of a wireframe might force you back to the blueprint’s drawing board, but it’s better to make such changes on paper rather than reengineering the entire site at some point in the future.
    Wireframes describe the content and information architecture to be included on the relatively confined two-dimensional spaces known as pages; therefore, wireframes themselves must be constrained in size. These constraints force the information architect to make choices about what components of the architecture should be visible and accessible to users; after all, if the architectural components absorb too much screen real estate, no room will be left for actual content!Developing wireframes also helps the information architect decide how to group content components, how to order them, and which groups of components have priority.Wireframes are typically created for the site’s most important pages—such as main pages, major category pages, and the interfaces to search—and other important applications. They are also used to describe templates that are consistently applied to many pages, such as a site’s content pages. And they can be used for any page that is sufficiently vexing or confusing to merit further visualization during the design process. The goal is not to create wireframes for every page in your site, but only for the ones that are complicated, unique, or set a pattern for other pages (i.e., templates).Wireframes represent a degree of look and feel, and straddle the realms of visual design and interaction design. Wireframes (and page design in general) represent a frontier area where many web design-related disciplines come together and frequently clash. The fact that wireframes are produced by an information architect (i.e., a non-designer) and that they make statements about visual design (despite being quite ugly) often makes graphic designers and other visually oriented people very uncomfortable. For this reason, we suggest that wireframes come with a prominent disclaimer that they are not replacements for “real visual design.” The fonts, colors (or lack thereof), use of whitespace, and other visual characteristics of your wireframes are there only to illustrate how the site’s information architecture will impact and interact with a particular page. Make it clear that you expect to collaborate with a graphic designer to improve the aesthetic nature of the overall site, or with an interaction designer to improve the functionality of the page’s widgets.We also suggest making this point verbally, while also conveying how your wireframe will eliminate some work that visual designers and interaction designers might consider unpleasant or not within their expertise. For example, just as you’d prefer that a designer select colors or placement for a navigation bar, you’ve relieved the designer of the task of determining the labels that will populate that navigation bar.Finally, because wireframes do involve visual design, their development presents a perfect opportunity for collaboration with visual designers, who will have much to add at this point. Avoid treating wireframes as something to be handed off to designers and developers, and instead use them as triggers for generating a healthy bout of interdisciplinary collaboration. Although collaboration slows down the project’s schedule, the end product will be better for it (and besides, it may save you time during the project’s development).

    Example of a wireframe

    Example of a wireframe

  2. blueprints — show the relationships between pages and other content components, and can be used to portray organization, navigation, and labeling systems. They are often referred to as “site maps”. Blueprints can help an information architect determine where content should go and how it should be navigated within the context of a site, subsite, or collection of content.

    eg of a blueprint

    Example of a blueprint

  3. controlled vocabularies — There are two primary types of work products associated with the development of controlled vocabularies. First, you’ll need metadata matrixes that facilitate discussion about the prioritization of vocabularies (see Table 12-1 for an example). Second, you’ll need an application that enables you to manage the vocabulary terms and relationships. The information architect’s job is to help define which vocabularies should be developed, considering priorities and time and budget constraints.
  4. metadata schema — walk clients and colleagues through the difficult decision-making process, weighing the value of each vocabulary to the user experience against the costs of development and administration.

    metadata schema

    A metadata matrix for 3Com

9. Write a brief description for the title, what the key duties are, which potential companies will hire people with those skillsets, and what sort of remuneration is provided.

Web Developer/Designer

  • description: A web designer creates the look, layout and features of a website. The job involves understanding both graphic design and computer programming. Once a website is created, a designer helps with maintenance and additions to the website. They work with development teams or managers for keeping the site up-to-date and prioritizing needs, among other tasks.
  • duties:
    • Writing and editing content
    • Designing webpage layout
    • Determining technical requirements
    • Updating websites
    • Creating back up files
    • Solving code problems
  • hiring companies:
    • Software companies
    • IT consultancies
    • Specialist web design companies
    • Large corporate organisations
    • Any organisation that uses computer systems.
  • remuneration: $60k/year

UX Designer

  • description:
    • creating the look and feel of a specific computer interface
    • navigate the functionality of that interface and produce a certain type of human-computer interaction
    • applying their skills to a website or computer product, such as a piece of software
  • duties:
    • Part of a design process involving research, experimentation, and revision.
    • Incorporate usability testing feedback.
    • Elicit constructive feedback and capable of interpreting that feedback into design solutions.
    • Perform field research to discover and implement important design details that people may not realize they need.
    • Collaborate with others and work well with developers and product management.
    • Familiar with Agile/Scrum methodology.
  • hiring companies:
  • remuneration: $70k/year

SEO Manager

  • description:
    • Have a thorough knowledge of search ranking factors and critical updates
    • Familiar with industry-standard bid management and SEO software
    • Have personally built and optimized a $10k+ per month pay-per-click account that met or exceeded specific business rules (such as CPA goals)
    • Have managed a team of content writers, link builders, and social media marketers
    • Comfortable working with API’s, advanced and integrated reporting
  • duties:
    • Day-to-day management of paid and natural search engine marketing campaigns
    • Oversight and management of onsite and offsite SEO resources
    • Research and strategic planning for paid and natural search campaigns
    • Staying abreast of (and sharing) changes in search engine signals and market share
    • Improving and enhancing boilerplate project lifecycles based on signal changes
  • hiring companies:
  • remuneration: $60k/year

Professional Web Content Writer

  • description: a person who specializes in providing relevant content for websites. Every website has a specific target audience and requires a different type and level of content. Content should contain words (key words) that attract and retain users on a website. Content written specifically for a website should concentrate on a specific topic. It should further be easy to read, offering the information in easy to understand clusters or laid out in bullet points.
  • duties:
    • Succinct, fact-filled content
    • An engaging, active tone
    • Writing broken up by subheadings
    • Use of bulleted lists
    • Embedded links throughout the text
  • hiring companies:
  • remuneration: $80k/year

Information Architect

  • description:
    • An information Architect provides positive user experience by planning and designing the information structure for websites and web applications.
  • duties:
    • translate user behavior into media structure
    • craft interactive experiences
    • produce workflow diagrams and other production materials
    • organize information into site maps
  • hiring companies:
  • remuneration:
    • $80k/year

10. Check out the Information Architecture Institute. Comment on what sort of value you see such an institute being to the community. Place a link on your blog to the institute.

IAI has the vision of educating us (designers, developers, and other professions related to the web) to understand the importance of proper structuring of content and information in the websites and intranet. If everyone understood the concept of IA, we’ll be able to provide a seamless searching and browsing experience for users who are trying to find something in the websites. People can work more efficiently in that way. The institute also serves as a community for people to discuss about IA, be it the changing web scene or challenges that the professionals are facing.

http://iainstitute.org/

11. Describe what is meant by the term “information ecology”.

Information ecology is a science which studies the laws governing the influence of information summary on the formation and functioning of bio‐systems, including that of individuals, human communities and humanity in general and on the health and psychological, physical and social well‐being of the human being; and which undertakes to develop methodologies to improve the information environment (Eryomin 1998).

“Information ecology” is composed of users, content and context to address the complex dependencies that exist. The three circles illustrate the interdependent nature of users, content and context within a complex, adaptive information ecology. We need to understand the business goals behind the web site and the resources available for design and implementation. We need to be aware of the nature and volume of content that exists today and how that might change a year from now. We must learn about the needs and information-seeking behaviours of our major audiences. Good information architecture design is informed by all three areas.

Information Architecture in Website Design

Information ecology

12. What is content management and how does it relate to information architecture?

IA portrays a “snapshot” or spatial view of an information system, while CM describes a temporal view by showing how information should flow into, around, and out of that same system over time. Content managers deal with issues of content ownership and the integration of policies, processes, and technologies to support a dynamic publishing environment.

13. What is metadata and how is it used in information architecture?

Metadata is a term used to describe and represent content objects such as documents, people, processes, and organisations.

To what extent has metadata that describes the content and objects within your site already been created? Have documents been tagged manually or automatically? What’s the level of quality and consistency? Is there a controlled vocabulary in place? Or have users been allowed to supply their own “folksonomic” tags to the content? These factors determine how much you’re starting from scratch with respect to both information retrieval and content management.

14. Explain why the “Too-Simple” information model is unrealistic for modelling users’ information seeking behaviours.

"Too-Simple" information model

“Too-Simple” information model

Fig. 4: “Too-Simple” Information Model

This is a very mechanistic and ultimately dehumanizing model for how users find and use information on web sites. In fact, in this model, the user, like the site itself, is just another system—predictable in behavior, rational in motivation.

Why do we have a problem with this “too-simple” model? Because it rarely happens this way. There are exceptions—for example, when users know what they’re looking for, as in the staff directory scenario. Here, users have a question for which there is a right answer, they know where to find the answer, they know how to state the question, and they know how to use the site to do so. But users don’t always know exactly what they want. Have you ever visited a site just to poke around? By exploring the site, you’re trying to find information of a sort; you just don’t exactly know what you’re looking for. Even when you do, you may not have the language to express it: is it “PDA,” “Palm Pilot,” or “handheld computer”?

Users often complete their efforts at finding information in a state of partial satisfaction or outright frustration. Example: “I was able to find information on synchronizing my Palm Pilot, but nothing specific on syncing to a Macintosh.” Or, during the process of finding, they may learn new information that changes what they’re looking for altogether. Example: “I realized that a Keough retirement plan is ideal for me, even though when I started I was trying to learn about IRAs.”

We also dislike the “too-simple” model because it narrowly focuses on what happens while the user is interacting with the information architecture. The information need’s context—all the related stuff that happens before and after the user ever touches the keyboard—gets left out. It also assumes an ignorant user who brings little, if any, prior knowledge to the table. So the model essentially ignores any context for this scenario.

Finally, by oversimplifying, this model cedes so many great opportunities to understand what goes on in users’ heads and observe the richness of what happens during their interactions with an information architecture.

This model is dangerous because it’s built upon a misconception: that finding information is a straightforward problem that can be addressed by a simple, algorithmic approach. After all, we’ve solved the challenge of retrieving data—which, of course, is facts and figures—with database technologies such as SQL. So, the thinking goes, let’s treat the abstract ideas and concepts embedded in our semi-structured textual documents the same way.

This attitude has led to the wasting of many millions of dollars on search engine software and other technological panaceas that would indeed work if this assumption were true. Many user-centered design techniques carry this misconception forward, assuming that the process of finding is simple enough to be easily measured in a quantifiable way. So we think we can measure the experience of finding by how long it takes, or how many mouse clicks it takes, or how many viewed pages it takes to find the “right” answer, when often there is no right answer.

15. Describe how a web site user typically finds information.

There’s 4 ways that users took to find information in a website.

  • The perfect catch — knowing the exact thing to search for and make a precise search
  • Lobster trapping — just wanting to search a few good information enough to perform a certain task
  • Indiscriminate driftnetting — making sure that every research has been looked into before
  • I’ve seen you before, Moby Dick — making bookmarks along the way so you’ll know what you’ve seen before

16. What is known-item seeking? Give two examples.

Sometimes users really are looking for the right answer. Let’s think of that as fishing with a pole, hoping to hook that ideal fish. What is the population of San Marino? You go to the CIA Fact Book or some other useful site that’s jampacked with data, and you hook in that number (it’s 29,251, by the way).

When I want to book a flight back to Singapore and I already know that I’ll definitely book from Flyscoot since it has always been the cheapest air flight that flies me back to Singapore safely.

I want to know the student price for Macbook Pro Retina 17″.

17. What is exploratory seeking? Give two examples.

You don’t really know much about what you’re looking for, and aren’t ready to commit to retrieving anything more than just a few useful items, or suggestions of where to learn more. You’re not hoping to hook the perfect fish, because you wouldn’t know it if you caught it. Instead, you’re setting out the equivalent of a lobster trap—you hope that whatever ambles in will be useful, and if it is, that’s good enough. Perhaps it’s a few candidate restaurants that you’ll investigate further by calling and checking their availability and features. Or maybe it’s a motley assemblage of Lewis and Clark stuff, ranging from book reviews to a digital version of Clark’s diary to information about Lewis & Clark College in Oregon. You might be happy with a few of these items, and toss out the rest.

When I went to Tasmania last summer, I wanted to book an accommodation that’s not too pricey and can hold my family of 6 for 3 days 2 nights, I just did an exploratory search to find somewhere that’s near Freycinet National Park and has a beautiful ocean view.

I wanted to make my favourite Laksa and they give me a Singaporean and Malaysian recipe and I need to decide to go on with the Singaporean version or try out the Malaysian one.

18. What is exhaustive research? Give two examples.

Then there are times when you want to leave no stone unturned in your search for information on a topic. You may be doing research for a doctoral thesis, or performing competitive intelligence analysis, or learning about the medical condition affecting a close friend, or, heck, ego surfing. In these cases, you want to catch every fish in the sea, so you cast your driftnets and drag up everything you can.

When I was researching about Piet Mondrian and his painting Composition No. 10 Pier and Ocean, I want to find all the information that I can search from Google.

Composition No. 10 Pier and Ocean by Piet Mondrian

Composition No. 10 Pier and Ocean by Piet Mondrian

19. What is re-finding? Give two examples.

There’s some information that you’d prefer to never lose track of, so you’ll tag it so you can find it again. Thanks to social bookmarking services like del.icio.us—which were primarily intended to support refindability—it’s now possible to toss a fish back in the sea with the expectation of finding it again.

Pinterest also serves as a platform of bookmarking by pinning any images or media found on the web and classifying the web findings into various art boards.

20. What is the Berry Picking Model? Give an example of how you might search for a topic using the Berry Picking Model.

Users start with an information need, formulate an information request (a query ), and then move iteratively through an information system along potentially complex paths, picking bits of information (“berries”) along the way. In the process, they modify their information requests as they learn more about what they need and what information is available from the system.

"Berry Picking" Model

Berry Picking Model

If the berry-picking model is common to your site’s users, you’ll want to look for ways to support moving easily from search to browse and back again. Yahoo! provides one such integrated approach to consider: you can search within the subcategories you find through browsing

I’ll take ebay as an example:

ebay eg

ebay example

After searching for ‘go pro’, on the left hand side, there’s the category section. From there, I gained more information and start to be more specific in my research.

21. What is the Pearl Growing Model? Give an example of how you might search for a topic using the Pearl Growing Model.

Users start with one or a few good documents that are exactly what they need. They want to get “more like this one.” To meet this need, Google and many other search engines allow users to do just that: Google provides a command called “Similar pages” next to each search result. A similar approach is to allow users to link from a “good” document to documents indexed with the same keywords. In sites that contain scientific papers and other documents that are heavy with citations, you can find other papers that share many of the same citations as yours or that have been co-cited with the one you like. Del.icio.us and Flickr are recent examples of sites that allow users to navigate to items that share something in common; in this case, the same user-supplied tag. All of these architectural approaches help us find “more like this one.”

I’ll take ebay as an example again. I did a keyword research on ‘go pro’ and the ebay search engine searches any items with ‘go pro’. Beneath the search bar, there’s a related searches that suggests more things related to ‘go pro’ such as ‘gopro, gopro hd hero 2, gopro accessories, helmet camera etc’. This helps users to broaden their search.

22. Explain what search analytics is and how it helps you learn more about information needs and information seeking behaviours.

Search analytics involves reviewing the most common search queries on your site (usually stored in your search engine’s logfiles) as a way to diagnose problems with search performance, metadata, navigation, and content. Search analytics provides a sense of what users commonly seek, and can help inform your understanding of their information needs and seeking behaviors (and is handy in other ways, too, such as developing task-analysis exercises). Search analytics is based on a high volume of real user data, it doesn’t provide an opportunity to interact with users and learn more about their needs directly.

23. Explain what contextual inquiry is and how it helps you learn more about information needs and information seeking behaviours.

Contextual inquiry, a user research method with roots in ethnography, is a great complement to search analytics because it allows you to observe how users interact with information in their “natural” settings and, in that context, ask them why they’re doing what they’re doing. Other user research methods you might look to are task analysis, surveys, and, with great care, focus groups.

Introducing me!

Introduction

Hey all!

I’m Angie, and I’m from Singapore. I came from the same country as Andy (if you still remember who Andy is after the World Cup).

A refresher:

And yes, probably you remember now.

I’m a graphic and web designer studying Bachelor of Design in Visual Communication in the South Bank campus. I’m design-trained and I learned HTML, CSS, Javascript and PHP by myself, just enough for me to hand code a website or modify WordPress themes. I love to design websites because this is the only area where I can fuse design with logic. I’m doing my last semester now and I’m really excited to graduate by the end of this year!

When I first saw this module, I thought that this is going to be a course to learn how to use a Content Management System (CMS) such as WordPress. After reading the course profile, I came to understand that we’re going to learn about Information Architecture (IA) which was mentioned pretty often in my User Interface Design module last semester. What I know about IA is the importance of grouping similar information together in a particular order that allows users to look for information easily and comfortably. I also realised that we will be learning how to use Drupal instead of WordPress. I’m not sure why, but I did read about the goodness of Drupal before and wanted to use it, but I’m being too comfortable in using WordPress. This will be a good chance for me to learn more about Drupal and add it to my skill sets.

I’m afraid that I do not know anyone in this course since I’m from the South Bank campus doing arty farty stuff, but I do really wish to work with like-minded people, bashing out ideas and doing something awesome, meaningful and portfolio-worthy.

I have written a few blog posts before, I have designed and developed WordPress sites for clients, I love to look for interesting plugins and widgets and see what magic they do, yeah if you consider these as part of maintaining a blog.

My aim is to be like Chris Coyier and Jacob Cass, earning a living through blogging about the web. After I graduate, I’ll join a design studio and work as a web designer and front end developer, while still continuing design freelancing.

And last of all, this is my email address:
angie.ng@griffithuni.edu.au