Working as part of team Acumen I was tasked with creating the wireframes for the new frontend of the Fawcett Society’s new web build (which I was also product, ux and design lead for). Key challenge was to integrate the UX discovery work completed so far into a set of wireframes facilitating the key Fawcett user stories we’d mapped out.

Task

The UX objectives of the new site were:

• Highly usable frontend facilitating key user journeys: information search, membership signup, media communication and contact initiation.
• Address different user segments effectively, and non-exclusively: Westminster Village actors, General Public, Media, External Supporters.
• Afford involvement in active campaigns via a range of actions.
• Present a modern, up-to-date, progressive experience for all visitors, reinforcing Fawcett’s PR objectives.

Process

The UX documentation (some of which you can see here) I had developed up to this point:

• Targets, goals and objectives (KPI’s) – organisational, digital and for users, over the next 6 and 12 months.
• Key insights from face to face interviews with key user-types.
• Market research insights
• Exploration of key user types and personas
• User stories/scenarios for the key user-types
• User lifecycles, conversions, touchpoints and just-in-time information mapping
• Draft sitemap
• Current site analytics insights
• Content strategy

I used these documents to develop the initial IA and page sketches (using pencil & paper), focussing on supporting the prioritised user stories of the key user-types.

I began to hone down some key concepts, and first draft versions of a number of the pages. I then moved on to developing high resolution wireframes in photoshop:

I’m pretty quick on these, pixel perfect tweaking taking a distant second-seat to getting nice digital layouts of the pages.

Results

The wireframe deliveries were successful on a number of fronts:

• Being the first visual concepts for the new website, they were effective in communicating our vision for the new site – vastly different from the client’s current site.
• The user-stories focussed on were well serviced by the wireframes, with functionality matching user and organisational needs successfully.
• The IA and wireframes combined helped the client re-align their perspective on the new site, it’s content, and organisational site objectives. So they did, in effect, inform the organisation’s communcations, content and digital approach. An interesting process to be a part of for sure!
• The site IA successfully supported the appropriate interactions and communications.
• The client was extremely happy with the approach, acknowledging the high degree of understanding evident, of their domain and specific site challenges.

The post UX and Wireframe work for The Fawcett Society appeared first on aliadair.co.uk.