Design Process

Overview

A website design project is a collaborative effort between CLA Communications, CLA Information Technology, and the department, or center, team (or individual) responsible for maintaining the website. The scheduling of design/redesign queue is largely decided by CLA Communications and CLA Information Technology, however feel free to contact us to request that a website be added to the queue. The project covers everything from purpose, goals, audience, focus groups, content inventory/audit, search engine optimization, design iteration, training, usability testing, and accessibility compliance. Depending on the volume of content the project is generally expected to take between three to six months to complete. On this page you will find all of the forms, tools, files, timeline, and other information needed throughout the project.

Expectations

The project is a significant commitment (for all parties) and will require the following from the department/center:

  • 3 or more people from the department/center dedicated to the project throughout the entire process
  • 3 - 6 months
    Timeline (6 steps)

Tools

  • Google Analytics
  • Teamwork CLA Information Technology will provide special access to some of these tools during different steps of the project.

Step One

1 - 2 weeks

Define

At the start of every project we help you identify the purpose, goals, audience, and key messages of the website. This is a crucial step in order to ensure the success of the project, and is a prerequisite to scheduling the project kick-off meeting.

Tasks

Department/Center (with assistance from CLA Communications)

  • Do purpose/positioning exercise
  • Write out dedications. Find examples that show who you are.
  • Write a course catalog description (elevator pitch)
  • Write out experience map and identify key messages/content to address questions and feelings (see Resources)

    Meeting 1

  • Fill out the web planning questionnaire

    Meeting 2

Meetings

Meeting 1: Prep Work Review

  • Attendees: CLA Communications and department/center
  • Duration: 1 - 2 hours
  • Agenda: Review prep work and set up a time for the kickoff meeting

Meeting 2: Kickoff

  • Attendees: CLA Communications, CLA Information Technology, and department/center
  • Duration: 1 hour
  • Agenda:
    • Web planning questionnaire
    • Goals for the website
    • Audiences for the website
    • Analytics review of the current website
    • Set up access to our teamwork.com account for this project, which is used for project management, task delegation, file sharing, and project communication
    • Set timeline dates
define-animation
organize-animation

Step Two

3 - 4 weeks

Organize

Once we have a broad understanding of the purpose, goals, audience, and key messages, we help guide you in streamlining your content organization. The most important quality of a good higher education website is the ability to convey the information to the user in a clear and accessible manner. Often times, this means creating new and improved information structures and navigation.

Tasks

Department/Center

  • Identify user stories
  • Conduct a content inventory of the current website (see Resources)
  • Determine the site map (what pages you want on your site and how they fit / relate together)
  • Determine hierarchy of content - rearrange the content based on the content inventory

    Meeting 1

  • Develop content outlines to inform the design (see Resources)
  • Fill out the Web Design & Functionality Questionnaire

    Meeting 2

Meetings

Meeting 1: Site Map and Content Inventory and Hierarchy

  • Attendees: CLA Communications, CLA Information Technology, and department/center
  • Duration: 2 hour
  • Agenda: Review the site map and content inventory and hierarchy and provide suggested changes.

Meeting 2: Design and Content

  • Attendees: CLA Communications, CLA Information Technology, and department/center
  • Duration: 2 hours
  • Agenda:
    • Review outlines
    • Review web design & functionality questionnaire
    • Identify visual opportunities to communicate (photos or graphics to convey information)
    • Discuss special needs
    •  

Step Three

3 - 4 weeks

Visual Development

The best design transforms your content into a powerful information source with an accompanying, but not overpowering, visual appeal. It’s important to create a friendly and interesting site that keeps users engaged and comfortable with coming back for information.

Tasks

Department/Center

  • Write the content (and upload to teamwork.com as its ready)
  • Secure student testimonials
  • Secure faculty bios and photos (CLA Information Technology can take these photos if needed)
  • Identify alumni stories (to share or secure)
  • Secure photos/videos
  • CLA Information Technology to send design URL to the department/center

    Meeting 1 (as soon as CLA Information Technology is ready)

    Meeting 2

    Meeting 3

CLA Information Technology

  • Design key pages of the site
  • (After Meeting 1) Create website navigation based on the site map and content hierarchy from Step Two (see Resources)
  • (After Meeting 1) Design full-page and content templates
Meetings

Meeting 1: Mockup Design Review

  • Attendees: CLA Information Technology and department/center
  • Duration: 30 - 60 minutes
  • Agenda: Review mockup of the website design

Meeting 2: Design Review

  • Attendees: CLA Communications, CLA Information Technology, and department/center
  • Duration: 1 - 2 hours
  • Agenda:
    • Review website design
    • Review navigation
    • Review and finalize content
    • Identify key performance indicators (KPIs - what to measure)

Meeting 3: Training

  • Attendees: CLA Information Technology and department/center
  • Duration: 1 - 2 hours
  • Agenda:
    • Review website design themes
    • Provide training on Page Builder
  •  
Resources

Tools

Standardized Navigation

  • About
    • People / Faculty
    • Labs / Research Centers
    • Careers in ...
    • Facilities
    • (optional) Message from the Chair
    • (link to) College of Liberal Arts
  •  Students
    • Undergraduate
    • Graduate
    • Advising
    • Scholarships
    • Commencement
    • Internships
  • News & Events
  • Alumni
    • Alumni Stories
    • (link to) College of Liberal Arts Alumni
    • (link to) Alumni Association
  • Giving
    • Donor Stories
    • Giving Overview
  • Apply (a button throughout the site)
    • Learn More (contact form page)
visual-development-animation
site-build-animation

Step Four

3 - 5 weeks

Site Build

The site build encompasses implementation of the content using design patterns and templates created during visual development. This is a collaborative effort between the department/center and CLA Information technology to lay out content in a way that is visually engaging, consistent with the CLA VBL, and meets the goals of the website and each page.

We also develop the custom code necessary to realize the unique design of the website, adhering to industry standards and best practice.

 

Tasks

Department/Center

  • Implement the content (copy, photos, videos, documents) into new templates on the new website, while checking for accessibility compliance (see Resources)
  • Search engine optimization - page titles, headings, meta descriptions, alt tag attributes, anchor text

    Meeting 1

  • Create a governance plan - how to, and who will, maintain the website

    Meeting 2

CLA Information Technology

  • Modify design and templates as needed
  • Build sections of the website that require custom development
Meetings

Meeting 1: Implementation Assistance

  • Attendees: CLA Communications, CLA Information Technology, and department/center
  • Duration: 1 hour
  • Agenda: Review the website with content implemented and provide assistance if needed.

Meeting 2: Analytics and Design Review

  • Attendees: CLA Communications, CLA Information Technology, and department/center
  • Duration: 2 hours
  • Agenda: 
    • Add goals and events to Google Analytics
    • Review the website to determine if any additional design or development work is needed

Step Five

2 - 3 weeks

Refine

Once we have a working model of the new website, it’s important to make sure the content, design, and programming all work together to produce a quality product that provides an enjoyable user experience.

Tasks

Department/Center

  • Conduct web accessibility testing of every page
  • Conduct usability testing with students

CLA Communications and CLA Information Technology

  • Review website content and design
  • Conduct internal usability testing

CLA Information Technology

  • Modify design, layout, and navigation based on feedback from usability testing
Resources
refine-animation
launch-animation

Step Six

1 - 2 weeks

Launch

The most exciting step is revealing all our collective hard work to the world with a fresh and interesting new site.

Tasks

Department/Center

  • Determine a launch date and notify CLA Information Technology
  • Create announcements (email to department/center, social posts, etc)
  • Fill out the Website Redesign Feedback form

CLA Information Technology

  • Archive the current website
  • Make the new website live
Resources