Informational Website Mockup

Project Brief

BACKGROUND
The informational website is perhaps the simplest of all websites. Congressmen, doctors, lawyers, accountants, real estate agents, local businesses and skilled craftsmen use informational websites to display their work and describe their services while the actual business transactions or services they perform occur off-line.

The purpose of the informational website is to allow people to learn more about who the client is and what they do. More often than not, people would rather do their research before having to contact someone. The informational site serves this purpose well because people can visit the site at any time of day or night. The site can still serve information to prospective clients without taking up a minute of the client\'s time or while they are unavailable (outside of business hours, vacations, etc...)

The informational site gives the client the ability to display as much knowledge and expertise as possible. The internet is a mainstream source of information, people are going to spend extra time researching from a variety of sources before taking action. This site will indirectly build a rapport with its visitors. The more they trust the site and its content, the more likely they will contact the client or use their services.

BRIEF
You will select a local business, group, non-profit, etc... and construct an informational website showcasing their services/work. An emphasis will be placed on meeting their audience’s needs and goals.
Working with a real client is favored over fabricating your own.
When selecting a client to work with, keep in mind that you are stuck with their existing brand (if you feel you can manage to redesign a logo in addition to producing a website, consult with the instructor first). In a real-world environment we do not have much say in the clients we work with and we are not always able to reset a business’s identity.

PROJECT MILESTONES

1. Site Map
2. Creative Brief
3. Mood Board
4. Sketches
5. Wire-frame
6. Crit (mobile version only)
7. Crit
8. Crit (desktop version only)
9. Crit
10. Final Design Due with Presentation and PDF Binder of all project materials

Learning Objectives

You will not be expected to code and publish this site, however, design considerations should be made with coding limitations in mind.
Grasp organizing information on the web
Make design decisions based on the functions of the web
Considerations will be made based on "full" websites and mobile websites
Gain experience making design decisions in consultation with a real client
Make design decisions backed by research and user personas
Develop a mockup

Deliverables

PDF of all web pages (both desktop scale and mobile scale)
Adobe xD Interactive Mockup
Project Case Study

Reflections

This project serves as an intro to design as a process as well as an intro into organizing information and how the web works. I allow this project to take its time as it is the first website students have every constructed.

I push the idea of working with a real-world client but if it becomes clear the student can't handle that extra load then sometimes I will allow for make-up companies.

This is also frequently the students first experience with Adobe xD.

Hopes for the future:
I've always wanted to pair this class with a web development class so that the students can do front and backend work at the same time or in collaboration with another area or even design in the fall and code in the spring. We offer a usability course that goes over user testing and interface design—usually, I have the same students in that course as well, so the idea of collaborating with UX students doesn't really work.