Nature of the Project

From the get go it was made clear that the brand new platform would not be putting itself in competition with organizations in the same industry. It would also not run the risk of becoming “just another” platform.

Instead the objective was to build a light-weight platform, with enough content to keep most of its intended audience happy. There would be no false promises, no pretenses, just an honest representation of the company.

These efforts ironically began through close studies of competitor sights. A general list of strengths and weaknesses was made. It was noted that larger companies could afford a web presence designed by an expensive design firm. Smaller operators made use of pre-fabricated solutions such as bootstraps and WordPress – in many cases those put together by a less experienced design firm.

Design Process

Having absorbed some of the ideas and reflected over various kinds of layouts, we began drawing mockups. Mockups are an excellent means of simulating the look of the project to a certain degree.

The limitations that exist may be made up for by more expensive software that could not be made feasible for this project.

Initial mockups of home page yielded consensus. A simple page with three main options would allow a user to read about our work, check out our history or jump right in and start working with us.

The solution was vastly different from competitor sites which often advertise their own work and on which any user can spend literal hours browsing. This process was then replicated for each new page.

Content that had already been given, was inspected thoroughly and notes made on what was appropriate, irrelevant, wordy or boring within the context of the design. The company was then asked to redo the content with our advice on copywriting.

In this project, special attention was given to making the navigation easy and relevant. There are three levels: global, secondary and contextual. Similarly labels have been designed to be succinct and common to a degree with other sites.

No search tools were made available as it was decided the level of content held on the site could not justify it.

Asset Collection & Management

No effort on the web can run away from this. Some projects of course are easier than others. Finding ourselves short of serious art direction we turned to the next best thing: stock assets.

The web is chock-full of assets. Images, videos, vectors – all can be had for a price. But wanting to turn our project as economical as possible for our client we turned to assets that could be licensed under CC.

This aspect of the project took considerably longer and ways are being sought in which this can be shortened. One reason why AM takes long is because each asset has to be evaluated against itself and also as part of the other elements on the site for both quality and overall fit.

Once selections are made, it often has to be modified heavily in a variety of applications such as Photoshop, ImageOptim and others to help it meet UX requirements of modern websites. These requirements including optimization for low and high density (retina) displays.

Responsive Design

The number of users accessing the web from mobile devices is growing in the client’s home market which is considered a developing economy. A responsive design ensures the reach of the site is as wide as possible. A mobile first approach was taken to allow:

• Display of graphics based on the quality of users’ screen
• Using media queries to adjust the layout
• SVG instead of raster graphics to ensure low data charges
• Reduce load times

Notable in this project was the use of responsive image techniques. The use of the srcset property of the CSS has allowed the site to be optimized for high and low density pixel devices – among other names the “Retina” devices. Additionally the w-descriptors allow for art-directed images to be loaded at determined breakpoints.

Information Organization & Labeling

The layout of the site has been optimized for clarity and ease of use. There are a few content rich pages which provide in-depth information about the company and then a second group which provides localized content.

A high-level information architecture blueprint for the site

Given the nature of the content that will be included on the site, there is very little opportunity for the implementation of exact organization schemes, these are for example organizing collections of information according to date or the alphabet.

There is however the use of the ambiguous organization scheme through topic, task and audience.

Referring to the blueprint, users can read about the organization’s background, its staff and the kind of work it has experience in. Alternatively, they can access localized information about industries, services provided and related case studies.

Navigation Systems

The navigation system for the site was reviewed and revised several times over and now consists of global and contextual elements. Local elements do not figure into the design as there is no content to justify its existence.

The global navigation is provides quick access to the most important areas of the site. It is available on every page with the following links:

Home – return to the home page
Industries – localized content for every industryServices – principal page of services provided by the organization
Our Approach – one of the pages from the value-added guides
FAQs – all the frequently asked questions about the local market
Contact Us – contact details, including embedded Google Maps

Contextual navigation present on the site helps the user to navigate through the site as though a story is being read. When the user follows these links which have been made purposely large, they will run through the key areas of the site.

This strategy ensures that users are less likely to get lost and therefore less likely to waste time on the richer content.

Interactivity

While some competitor organizations enable a much higher level of interactivity through the use of forms and document uploads, this project did not include those features for reasons of economy. A minimum level of interactivity is still guaranteed through the use of a contact form which enabled by PHP scripts allow the user’s message to be sent directly via e-mail to the company director. An integrated Google Map allows the location to be saved by the users for later reference or as navigational aid to the physical premises.

 

 

As the world becomes an increasingly complex place, with an unprecedented number of interactions occurring on every platform it becomes vital to ensure that we present our information making it relevant and easy to locate.

Google is no slouch. It has made billions of dollars off the concept of organizing information. Complex algorithms, which are accepted as trade secrets have not stopped inquisitive minds from trying to at least decipher these virtual magic tricks if not beat them at their own game.

But the notion of structuring data so that it can be used as information is an old one. You might even consider equating the job of a librarian, in modern times, to a telephone switch operator who would appear out of place in the world of towering gigahertz antennas supporting an elaborate cellular network.

Interestingly though you soon realize, as you delve into books on the subject, that the humble librarian could just as easily feel at home on a Google campus as they could in a dusty library. The point here is that information architecture is alive and well and can be applied to any project. It is one component of many which forms the bedrock of user experience (or UX) as we will see.

Defining context

The easiest way to understand iA in practical terms is to apply it to a project. The difference between an iA led effort versus non-iA can be like night and day. But iA can be applied more subtly, and applications can be so good that a high level of abstraction is imperceptible – the abstractions here referring to how seamlessly a user transitions from searching for content to finding and using it.

An online presence developed through effective use of iA (www.kpmg.com)

An online presence developed in a hurried manner with little use of iA

Following the guidance of Morville and Rosenfield, our first step is in defining context. This case involved developing a new site for a small auditing firm. The operating market is small, but the big four audit firms it generally competes with have seemingly infinite pools of talent and content developed internationally.

The quest of developing a compelling and competing online presence is out of question. There is simply no way a small firm with under ten full time staff could generate that level of relevant, local and tailored content.

But thinking locally, and engaging more directly is a strength of the company. Being small and nimble and relying on its existing connections allows it work just as successfully. Alliances with professional bodies affords it instant credibility which new clients may find comforting.

One final point, is that ultimately a client will choose an audit firm based on directives from standard guidelines or on a cost-based decision. This leaves the firm in the study worse off in the first instance, but better off in the second where it gets most of its business from.

The goals set in terms of context are:

1. Rely on its image value-for-money service provider as a unique selling point
2. Communicate the local context more effectively than others
3. Create an attractive interface for new business

Defining content

Content is more than just presenting information as it is. When designing content based on iA principles for the web, the result is information which is consistent, easy to find and follow. These ideals are underpinned by tools which determine the how.

• Structure of the document
• Navigation
• Tools for search which maximize findability and
• Consistent use of language and terminology

There is always a small chance that content is consumed differently between users. It is a fact in much larger implementations where more content is presented. For this reason, every effort is made to adapt information to a variety of users.

Unsurprisingly, not only has content have to be modified but content may have to be served differently depending on where and how it is being accessed.

Special emphasis needs to be placed on the terminology used too. Best practices in iA suggest that users respond well to a controlled vocabulary.

The goals set in terms of context are:

1. Balance the quantity of information and its findability
2. Use multiple navigation systems to guide the user
3. Allow content to be accessed independent of platforms or maximize device agnostic

Defining Users

The users are the audience of the site. We cater our content to those who are almost and most likely to read it. These two distinctions are made because overlapping content allows us to reach a wider audience.

A content that is too narrow can reduce its comprehensibility to all but subject matter experts. Similarly, content that is too broad will lack the specialty that keeps users interested.

As a result of these conclusions, several deepening sessions with audit professionals who may likely have a better understanding of how to present information would be quite valuable.

Features on the site which afford it some level of interactivity would rate it very highly. When a user can do much more than simply read, print and pass on information on the site it opens up new opportunities. The ability for the site to accept message from interested parties is one example of making the communication stream two-way.

The goals set in terms of context are:

1. Define who our users are and cater the experience
2. Use the right technical language to explain concepts
3. Include interactivity which enhances the overall experience e.g. fast scrolling for long pages and messaging features directing comments directly to the stakeholders

 

Having established the goals of the project, in Part 2 we will look at the application of these principles correspondingly in terms of context, content and users.