UX – Website Redesign

Website Content Strategy & Design Project: San Diego Floral Association

Proposed redesign for an organization in Balboa Park.

Content Assessment | Personas | User Testing | Information Architecture | Wireframes & Prototypes


Content Matrix

Created a spreadsheet of existing pages, urls, topics for evaluation, and assessed each for quality, order, relevance and other attributes. Pages were organized into categories & subcategories. These were used to define potential audiences and primary objectives of the site. Also collected all the content in individual documents for review and editing.


Personas

These hypothetical users were created to reflect the tastes, interests, and objectives of our primary target audience, based on the preliminary review of the content matrix, the existing site, and further research into the organization. Once we had a stronger understanding of our target group, we did a preliminary cleanup of the content structure.

The audience was determined to be generally low-tech, mostly retired, homeowners, some industry professionals, etc. Persona cards created with Extensio (Also created an identical version in Excel which could import data from survey spreadsheets and autofill in this clean visual format for multiple personas.)

Image of Persona panels


User Testing: Standardization Grid

We designed card-sort exercises to define the most relevant tasks and objectives, and how these users thought about and performed those tasks. Tasks were then re-categorized, prioritized, tested for consistency with a reverse card sort, and adjusted based on a standardization grid which weighted tasks based on their value to users.

After performing a Card Sort with users to assess how they identified with and thought about terminology for a variety of tasks we assessed the data. I created this Standardization grid in Excel using conditional formatting to identify key content groupings. This helped define our primary areas of interest and a more concise and clear structure focused in three zones: Events, Solutions, and About the Organization.

sdfa-02-standardization-grid


Info Architecture

Initial Abstract Model of content used to define final information architecture, created in Excel.

sdfa-03-info-architecture


Wireframes, Prototypes, Design

From there, the design phase begins with lower fidelity sketches and wireframes, to high-fidelity prototypes, ensuring that content and layout assists in reaching the primary objectives. Development of the site began in parallel with the final prototypes.

Prototype 1

Manual sketch and low-fidelity prototype created with Axure

sdfa-04-1-prototype-low


Prototype 2

Medium-fidelity prototypes for desktop and mobile created with Axure

sdfa-04-2-prototype-med


Prototype 3

High-fidelity prototypes for mobile and desktop created in Axure and Photoshop

sdfa-04-3-prototype-high


Website Mobile, Desktop

Final website and mobile views

sdfa-04-4-website-mobile-desktop

All work by Greg Klamt, except Personas and Standardization Grid with assistance by Yara Bertran on data collection for the card sort.


 

View Working Prototype