Project Week 2 — CREAA Website Redesign


I’ve been designing and creating Mobile-First responsive websites using HTML5, CSS3, Bootstrap, JavaScript and jQuery for a while now and have recently started a 16-week front-end development program. Here I’ll be posting my progress towards the following 16 weeks. You can check out my work on my personal website. Hit me up for full-time or freelance work, collaborations, or to say hello 🙂.

Overview

A modern and clean website represents your brand and its value — something the Chinese Real Estate Association of America’s site did not meet or deliver. Some important features are hidden in the navigation bar; there wasn’t a modern layout, and there wasn’t a clear direction for visitors to understand where to go, what to do or read. Some goals during this project were to create a modern look and feel site highlighting top features in the navigation bar, the organization’s mission and message and relevant information to new visitors and current members.

Link to websiteGithub

Technology Used

HTML5, CSS3, Bootstrap, Font Awesome

Problems

  • Layout — message, layout and images show outdated site with little care for impressing and/or sending a clear message to visitors.
  • Direction — lacking direction on what site visitors should do, click, read.

Process / Challenges

Having features hidden in tabs and without clear messaging and direction, I’ve taken what I believe are the most important features and added them to either the navigation bar, body section or footer.

Some important things added were: separate log in and join us buttons on the navigation bar, link to sign up for newsletters, mission, current board’s Chairman, President, and President Elect; corporate sponsors, a complete section for information, and a footer containing social media icons, phone number and address.

Research included real estate companies, agencies, and associations.

Wireframing




Result

A cleaner and modern look and feel, well-noted separation of messaging and direction, as well as consistency in font, colors, and new images, we can navigate with ease of knowing where to go, what to read, clear call-to-actions, and most importantly, the mission of the association.

Side by Side: New vs Old



Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.