When a client approached Digital Eskimo with a desire to build awareness about Peak Oil, we began our Considered Design process with a workshop that uncovered a raft of technical and frightening information on the topic. Through further research efforts however we also found a range of more hopeful signs that the the world could adapt to peak Oil. There had been an oil crisis in Cuba in the 70s and a documentary on the topic led us to investigate modern Permaculture, an Australian invention which ultimately led us to Transition Towns and the whole localisation movement.

Our strategic recommendation was that the we create a project that built knowledge and understanding around re-localisation – thus avoiding the contentious and divisive themes of Peak Oil, while still championing intelligent responses to its impact. The end result is a prototype website where users share content in the form of text, photos and videos that tell their stories about improving their neighbourhoods.

Outcomes

The live beta of live local was launched in April, 2009 and now has over 350 members and hundreds of experiments. After the successful pilot phase live local was incorporated into a Not For Profit foundation and is currently designing its strategy for growth ahead of looking for further partners to expand its mission to return Australians to a more local way of living.

Challenges

The website needed to be broadly accessible both for users to browse and contribute. Because the target audience was ordinary citizens who wouldn’t get personal training on how to use the system, the user interfaces needed to be simple enough for someone with basic internet knowledge to figure out, but powerful enough to generate interesting content. The project also came with a long feature wish list but limited time and budget to implement.

Design Strategies

Our iterative design and development process was ideal for dealing with the restricted timeline and lengthy feature list. We understood that the development process could not be forecast with complete accuracy, so we divided the site’s evolution into iterations and met to discuss priorities for development at the beginning of each one. Using Drupal, which provides some “out-of-the-box” functionality, allowed us to release early working versions that were testable and usable, and crucial to our iterative approach.

The basic design template was established early; in this instance we developed a working style guide to provide further design guidance rather than rigid wireframes and visual screens – which weren’t desirable because of budget and time restraints. For example, in the style template for tabs we defined a standard visual approach that developers can implement wherever tabs are required. Active, background and hover states are described.

Working with those documents, our developers were able to build early versions of the site and fine-tune the style guide and design needs in collaboration with our designers as the project progressed. For end-user usability, we customised Drupal’s content management system and designed a simple editing interface to make adding content easier for end users. “Experiments”, blog posts, static pages and comments can all be added, edited and administered from the one user friendly interface, and permissions for various users added and/or adjusted as required instantaneously.

As an example, we will look at the second iteration of live local, which was a two week process. The first iteration had produced a functional core and the ability for users to register and create their own content.

In the second iteration, we prioritised 11 user stories, which included adding RSS functionality, adding an abuse-reporting function (for users to flag inappropriate content and comments) and developing the visual structure. Every user story in the project was assigned a point value indicating its relative difficulty to implement, and the project owners, developers, and producers then identified their priorities.

On each day of the iteration, we had a standup meeting in which the web developers and designers reported their successes, next tasks and hindrances that had emerged since the previous meeting. Decisions were made in the standup meeting to ensure the iteration moves as smoothly as possible.

The second iteration was reasonably successful, tracking close to an ideal outcome, with about 24 of 30 total points completed in the round. At the end, the same group of stakeholders reassembled to observe the developers’ work in an early working version of the site. This meeting ensured that the project owners are engaged in the development process and had intimate understanding of the decisions made throughout.

View Website

Credits

• Creative Director: Dave Gravina
• Producer: John MacFarlane
• Designer: Chris Gaul
• Developer: Jeremy Epstein

Related posts:

1. live local
2. live local nominated for two AIMIA Awards
3. Tweeting the live local challenge

The Maritime Union of Australia (MUA) represents over 11,000 Australian maritime workers. As a key affiliate of the International Transport Workers’ Federation, it also helps to represent 320,000 of the world’s seafarers, who depend on ITF affiliates like the MUA for wage justice and protection against human rights abuse.

The MUA were seeking to redesign and rebuild their website to better serve their organisational objectives. They stressed the importance of building a website that would use new technologies to deliver compelling, relevant and timely content to their members in the workplace, whilst assisting stakeholders when organising union-related events and campaigns.

Digital Eskimo completed our scoping process, anchoring the direction and priorities for future work, and defining project objectives, stakeholders and opportunities. During the scoping process we identified use cases to represent ways these objectives might be met. These use cases where used as the basis of an iterative design and development cycle which had 3 full iterations prior to the launch of the website.

MUA and Digital Eskimo are now working together to continue the maintenance and nurturing of the web site as a core communications platform for the MUA.

Outcomes

The MUA website was launched on the 3rd of June, 2009. The MUA has successfully influenced the detail and timing of national shipping reform legislation through a campaign supported in part by emails from the site. The site was very well received by the union rank and file and is a focal point for the communications team who regularly update it with news and video content.

Iterative development

The scoping process for this site generated a  number of Personas each with a sizable number of user stories. User Stories are simple sentence statements of a person and the specific task that they need a design to do, for e.g. ‘As a user i want to be kept up to date on the latest MUA news’. See here for more information.

Using the MoSCoW prioritisation method (Must include, Should include, Could include if there is time, Won’t include at this stage but keep it in mind for the future), those user stories were ranked to ensure we tackled the important ones first. When the bulk of the user stories were deemed by the MUA to be “musts”, it became clear that a further round of prioritisation would be required. Before the second round of prioritisation, the development team reviewed the user stories in question and assigned a ‘technical weighting’ to them which gave the MUA the information they required to prioritise the stories more accurately. With an understanding of the complexity and associated approximate cost of each user story they were able to make more granular prioritisations.

The development of the MUA website was completed over a cycle of 3 iterations. Each iteration focused on completed sets of user stories and creating a demonstrable product at the iteration’s conclusion. By grouping user stories into themed sets we were able to recognise the key user flows and to start getting a picture of the possible information architecture.

Iteration 1

It was clear that certain elements of the site were fairly “domain neutral” (e.g., news & events pages) and those more generic user stories were selected as the focus of the first iteration. The team participated in a number of workshops addressing the user interface issues that required resolution. The outcome of these ‘GUI jams’ was a set of annotated wireframes, user flows and use cases that were used to brief both the design and development teams concurrently. Over the course of the first iteration, basic look and feel were developed and presented to the client as the generic functionality was developed and tested by the development team.

By the completion of the first iteration the look and feel had been presented and approved by the client and elements of the design had been integrated with the rough version of the site that was starting to take shape.

Iteration 2

The second iteration focussed more heavily on development while the designs evolved to incorporate changes created by new additions as further functionality was created. The development focus allowed us to address a number of the domain-specific requirements such as branch pages, industry pages and an initial homepage. By the end of the iteration the website was sufficiently complete that it could have been launched as a beta, had the client wished – the majority of site sections were complete, RSS feeds and print styles were implemented, some content had been migrated via automated scripts and the Content Management System (CMS) was fully operational. However the MUA decided to continue developing for a further iteration to allow for further testing as well as a site wide content review & edit.

The iteration concluded with a release to staging, a product demonstration to senior management, a final iteration review and planning session for iteration 3.

Iteration 3

Prior to the iteration planning meeting for this period of work, a set of use cases relating to mobile video functionality was initially included for this release. However strategic imperatives within the organisation shifted priorities towards the  promotion of MUA’s links to the International Transport Workers Federation. As such, user stories relating to the inclusion of mapping technology were prioritised, setting the ground work for future augmentation in that area.

Over the course of this iteration the client used the CMS to add, review and edit content which served the dual purpose of prepping the content for release while simultaneously being a significant period of user acceptance testing. The MUA was able to report any bugs in the project tracking software as they arose.

A number of generic content areas, including the ‘About’ and ‘Contacts’ sections where completed, as well as implementation of search functionality and global affiliations pages. Designs for these areas were refined and completed concurrently with their development. At the completion of iteration 3, we were ready to launch having completed all “Must have” use cases and addressed a number of high priority ‘Should haves’. The majority of content had been transferred onto the site, significant testing had been completed.

Finalisation and deployment

Rather than launching immediately, we spent a final period allowing the site to “bed in” whilst adding further content and bug reporting to be completed. The site was deployed to the production servers and the DNS transfer was completed five days later resulting in an exceptionally stable release.

View Website

Credits

• Creative Director : David Gravina
• Executive Producer: Anthony Ditton
• Producer: Michelle Gilmore
• Technical Lead: Rob Aston
• Designers: Chris Gaul, Soraya Asmar
• Developer: Jeremy Epstein, Simon Lichfield

No related posts.

Project Overview

Artbank is the largest buyer of contemporary Australian art in the country. The dedicated team celebrate and promote Australian culture by making the collection available for rent and reinvesting revenues into the collection. Focusing primarily on emerging artists, Artbank provides an opportunity for the general public to access the most exciting and up to date developments in Australia’s contemporary visual arts.

Artbank approached us to conduct an Innovation Workshop with the team, hoping to spark new insights prior to an organisation-wide strategic process. We knew there would be significant opportunities presented by interactive and connected technologies to support, inform, excite and engage Artbank’s stakeholders and went to work preparing for a fun day full of exciting opportunities.

Identifying and exploring these opportunities would assist Artbank in achieving their overall goal of supporting Australian artists, and raising awareness of their work within the Australian community.

Challenges

With 15 people to engage in the room, we had to ensure each participant could make the most of the day.  The group members also had various levels of technical understanding which we adapted to develop a shared language around new media tools.

Design Strategies

The design strategies resulting from the ideas generated during the Innovation Workshop accompanied by the insights gained throughout the scoping process opened up opportunities for initiatives which could, for example:

• Extend the engagement of clients by providing opportunities for interaction and discussion
• Give artists the ability to become more involved with their peers by interacting with various communities
• Foster excitement among the general public through the ability to track artworks and share information with friends
• Allow schools and universities to interact with artists and their work, providing an alternative learning platform for Australian cultural studies
• Many more which we are unable to share due to client confidentiality!

Outcomes

Various interactive touch points would enable Artbank to amplify and share collective messages, experiences and feedback, and simplify communications in order to reach a broad range of people. The half day workshop enabled staff to begin to identify how Artbank could extend its support to Australian artists by engaging with a broader audience. We looked at the ways in which other organisations were using social/new media tools as part of their digital strategies and developed a shared language around these popular technologies.

Related posts:

1. Artbank

Project Overview

The WWF Climate Witness program aims to document the direct experiences of people who are witnessing the impacts of climate change on their local environment and livelihoods. The key message is that climate change is happening right now to real people.

We had previously designed eight large expo style banners, each telling a different person’s story, that had been hugely successful. WWF wanted to develop the idea for the G8 Conference in Bali – however they did not have an official location from which to operate.

The series used emotive keywords to tell a very compelling story from afar while each banner told a personal story as delegates moved closer to the images.  The banners continue to travel around the world to remind world leaders that action needs to be taken urgently.

Challenges

WWF’s aim was to make an impact on delegates as they entered the G8 symposium on climate change, and for future events the Climate Witness team may attend. They did not have the official placement or capacity to cart the large expo banners we had created into position for this event, however, and a new solution was needed.

Design Strategies

Thinking about the need for mobility, fast movement and barrier like functions of the front line at the G8 we developed. We researched the impact of  conventional protest boards, their functionality and the user experience. We wanted to create something different, something that stood out in the crowd, something that expressed urgency, creativity, and that was visually attractive while clearly communicating the message in a playful way.

We developed a number of prototypes as we explored the opening mechanism and the impact the boards would have in a crowd situation. Lightweight foam core construction meant the boards could easily be lifted above the operators heads and affordable rubber plugs were sourced from our local hardware store to ensure they could be replaced easily should they go missing.

The entire design went through a dozen or so iterations and is testament to the effectiveness of iterative design.

Outcomes

Each protest board tells the story of  an individual climate witness that can be experienced up close. But a larger story is told from a distance – the collective message is assembled as the protest boards fan out in front of the viewer. The boards competed well in what was to become a media circus and delivered a personal message to delegates as they entered the talks.

Tati Guedes, Programme Administrator, WWF Australia, had this to say:

Related posts:

1. WWF Climate Witness
2. WWF Climate Witness banners
3. Climate (and other) change

newmatilda.com serves up Australia’s most progressive analytical writing, satire and illustrations, and represents the kind of independent media that is vital to a healthy democracy. newmatilda.com came to Digital Eskimo wishing to redesign the website from the ground up, including an upgrade to a new content management system. The management team made a bold decision to move from a subscription model to an advertising-supported model prior to our engagement, enhancing the need for us to increase the time spent on site and page views dramatically.

Outcomes

In the resulting design, reader participation is given much higher prominence and the centrality of discussion and contributions by the community around articles is highlighted. User comments and views drive the interaction on the site via a What’s Hot algorithm that takes into account comment frequency, views, date published and other factors. This feature was created both for its value to the end user and to reduce the need for What’s Hot editorial work from the small newmatilda.com team. The resulting functionality means the website responds to user behaviour in real-time.

Contributors also gained a much higher profile to enhance the importance of the mainly volunteer writing community that makes newmatilda.com possible.  Strong support for RSS and other social media tools ensures the content has the widest distribution possible, and that readers can easily share and disseminate articles. RSS was seen as particularly critical for newmatilda.com’s important news/web savvy media audience segment who often use these methods  to access large volumes of news content rather than visiting actual sites.

Since the launch of the new site, newmatilda.com readers reported a major increase in site usability and the overwhelming response from the audience was extremely positive. Readership numbers have skyrocketed, with newmatilda.com regularly receiving just shy of 4,000 unique visitors per day and newsletter subscriptions doubling in the first year of the redesign alone to over 10,000 subscribers.

Engagement has steadily increased from launch with the current (as of March 2010) average time on site over 7 minutes and average page views at 2. After launch the website also saw a dramatic reduction in bounce rates which has remained well below previous bests and a continuously increasing readership which now approaches 100,000 per month.

Challenges

newmatilda.com needed to extend its reach and increase incidental traffic to the site, ensuring an engaging user experience once there. The site’s community of readers are renowned for being outspoken and passionate, and the re-design had to be handled with sensitivity, especially when it came to advertising and content balance. The move to an advertising-based revenue model also presented a major technical and cultural shift within newmatilda.com itself.

Design Strategies

Starting with our in-depth Scoping process, we mapped the experience of the site’s current and potential users, as well as that of the editorial team, who upload and interact with site admin across the day. It was important to reflect the diversity of the content and the energy of editorial staff, and support the team’s internal workflow. We also needed to expand the readership beyond its traditionally older readers, who relied on an email newsletter to prompt their website visits.

While there was a wealth of content, the existing site made it hard to navigate and separated out interactions on the forum from actual articles. Together newmatilda.com and the Digital Eskimo project team uncovered important relationships in the content which allowed a taxonomy to emerge which drove the site architecture.

We identified and responded to three main user experience patterns (see diagram), and focused heavily on ensuring the demanding and diverse audience would be presented with opportunities to access the content in multiple ways. Exposing the broad variety of content was also important and the navigation was designed to promote a wide range of material. The Recent Articles menu presents current content in the top level site navigation itself providing ad-hoc users who want to get a sense of the breadth of recent articles on particular topics an effective way to do this.

A flexible tagging system allows newmatilda.com staff to create connections between articles and contributors which is critical for our stated goal of increasing average user time on the site.

We carried out wireframe walkthroughs to test many variations of the tagging system and page UI prior to settling on a small tag cloud under the eye catching image on each article page. This location resulted in the highest amount of eye contact on tags within the prototypes and ultimately click-throughs to related content in the final design. Average time on the web site in March 2010 was a very healthy 7 minutes and 7 seconds.

Importantly, we include the contributor’s name in the tag cloud to further encourage users to engage with specific writers and to raise the profile of this mostly volunteer team on the website itself. This provides value to newmatilda.com contributors and provides a pathway towards individual users subscribing to specific contributors, further customising the newmatilda.com experience for more engaged readers.

Example of User Interface mapping

Desk Research

Our scoping process involves varying degrees and types of research depending on the project and context. We often augment this with a separate research project as needed, however the budget wasn’t available for this project so we chose to focus a significant component of the research on low cost desk research and heuristic (expert) analysis of existing news/content sites.
Our rationale was that millions of dollars have been spent on interfaces solving similar user Interface problems for major organisations such as the International Herald Tribune, The Wall Street Journal and the BBC. It would therefore result in a very high return on investment to analyse these sites for possible learnings and design ideas.

We reviewed around a dozen sites and borrowed a few key features from relevant designs and also validated some of our recommendations with others. The Recent Articles menu, for instance, is an evolution of the Slate.com interface of the time. Our user interviews also revealed a surprising number of older readers who printed articles out and read them offline so we implemented a basic print style sheet to ensure maximum readability and ease of printing for these users.

View Website

Credits

• Creative Director: Dave Gravina
• Executive Producer: Penny Hagen
• Producer: Grant Young
• Designers: Chris Gaul, Theresa Schiabella

Related posts:

1. NewMatilda.com relaunches