ReDesigning A Website

 
 

The Notes and pre-planning

I like to start my process by gathering as much information as I can about the project so that I can best prepare myself  for any surprises and plan ahead for any issues or road bumps.

What Do the Stakeholders Want/Need?

I like to gather information on what the stakeholders want to see updated or changed. What ways can I make their app better? Has it been awhile since the last update, has there ever been a update?

-For a redesign I like to see how the current app/website is functioning, and what is it’s key role in the organization is. Have they changed since launch?

-What is their budget? for both time and finances? A more complicated design will take more time and money.

-What things currently work? what things don’t, do they need to revamp functionality? or is it more of a facelift?

-What information do I have to work with? Is there data that I have to maintain in a certain pattern/navigation? Do I need update patterns or navigation?

What Do the Users Need/Want?

What do the users need the app or website to do? How will the redesign make the experience more enjoyable and easier for the user overall.

-What is the current amount of users? and what are the demographics that make up the user base. Are more users joining or are they leaving?

-Who is the core user? while there might be many user types, what is the main user that will be using this day in and day out?

-Can we make the site more accessible to the general user? Or do we want it more tailored to the core user.

-What are some known pain points that users are currently experiencing? How can I help alleviate  the stress or confusion  associated with these areas. 

-What are some things the user would like to see? what charms and delights them? While redesigning can I add some of these design changes in to make the user experience more enjoyable?

WHat Is My Game Plan?

Once I get my key information on the Users and Stakeholders I like to setup a plan of action so I can hold myself accountable for what needs to get done.

-What is my timeline? When does this project need to launch?

-What are some issues I can see arising in the future what designing? will it affect timeline or budget?

-What are my resources like? While I have enough time to complete the things I need to complete in order to make this a successful design?

-Do I have all the information I need? If not how can I obtain it if I need to circle back around? Will I be able to conduct user studies?

-What is my team like; is my team experienced or are they just starting out? Will I need help some of the junior members with their tasks?


The Key Users

For this project I was lucky enough to have some pre-built user stories from the previous designer and the initial website launch. Most of the information was still relevant.

Here are some of the user personas for users that would be heavily utilizing the site.


Building Out the Wireframes

Since the redesign was an entire facelift with both appearance and some functionality I began building out some wireframes as well as rough models.

This is an example of some of the wireframes used to show the updates to design layout and functionality for the resources and webinar areas.


Presenting To the Stakeholders

When I have the flow and wireframes ready to present to the stakeholders I like to create an interactive presentation to show the current design and functionality ideas. 

-Does the functionality updates  met the standards and requirements? Is there functionality that might not be cohesive with existing functionality?

-Is proposed layout update in line with what the users and stakeholders need and want? Is it too jarring, will it make sense to the seasoned user?

-Are there any concerns with the changes? Are there any standards I’m not meeting? Am I meeting the needs of the user and the wants of the stakeholder?

-What do I need to do next to get ready for next steps? What changes do I need to make to the designs based off of this meeting?


Refining to High Fidelity

After meeting with the stakeholders and making the needed changes to the wireframes and getting the green light I move into the high fidelity designs. 

Here I take the wireframes and start adding in the colors, assets and font types; I also refine some of the sizing and placement of assets after seeing how the actual components fit in to the screen space. 

This is an example of some of the high fidelity mockups of resources, outreach and workshops screens to show the nearing completion designs.


User Testing

I like to build out an environment for core users to actually go through and test. This will allow me to track the functionality and engagement to ensure that the website is meeting user needs. And if not what can I do to make it meet those needs?

-For this project I was able to obtain a small group of core users. Mostly admin to test the updates.

-I was able to take detailed notes during the testing. This was mostly done online, watching the users go through the provided experience.

-I made notes of areas that still experienced some pain points such as registering for webinars and workshops.

-After the tests I compiled all my notes and went through the updates I would need to make before moving on to next steps.


Launch

Once the designs are finalized and core user studies conducted. I work alongside the devs to ensure a smooth launch.

-Meet with stakeholders before launch making sure that I have made all the needed design changes.

-I make sure the devs have access to any material or assets they need.

-Attend the scrums to make sure if any questions or concerns come up I can help address them or figure out a best approach.

-Listen to user feedback after the launch to provide continued support. I also set up a weekly meeting with the stakeholders to record data.