


Redesign using Flex
This was the second site I had built whilst studying at Yoobee. At this stage all I knew was html5, css3 and how to use flex and a little about responsiveness. No Bootstrap, no JS or JQuery, no plug-ins - nothing fancy or helpful at all. So this was a 100% hand coded site and was an exercise where we had to redesign the website of a website by the same name that is online.
All of us in the class had to redesign the same website. Our process was to sketch ideas on paper, then create a prototype using a wireframe - UX Pin, followed by user testing and then the process of coding. It was an iterative process over a few days.
Considerations for my design were:
- A much more modern look and feel
- A darker look to enhance the images
- A one page site again for a contemporary feel
- A simple to use site
- Less clutter than the original site
- More images and less wording
- Stylish and more upmarket than the original site

Project Brief
A full review of an existing website should take as long as the budget allows for. In this project you are required to perform a very quick, light review to practice the steps that should be taken to re-design an existing website:
How will you tell your story in this medium, and how will you tell it if they look it up later on a desktop?
Skills To Demonstrate:
- Formative UX Research Principles
- Lean Personas
- Wireframing
- Interactive Prototyping (Hi-Fi)
- User Testing
- Presentation
Learning Outcomes
By the end of the project, you should:
- Understand and implement visual design principles in a website
- Apply formative UX research techniques to form initial design concepts
- Test design prototypes using an appropriate collaborative tool
- Collaborate in a user testing session
- Participate in a group project to achieve a common goal
- Present a completed project to a group