Motive8 Website Redesign & Development

A complete website redesign and development, that has streamlined both the student and administration enrolment process.

The Problem

Motive8 is a Bradford based vocational learning centre, the then website the organisation had was in dire need of a front-end redesign. Having a strong and professional online presence was of paramount importance to the organisation, resulting in attracting more students to the learning centre as well as establishing themselves as a competitor to other surrounding centres.

  • Non-responsive website
  • Limited to no functionality
  • Poor layout / information architechture
  • No social media presence
  • No support for online dynamic features
  • Relevant / updated material not being available online

Motive8 previous website

My Role

This project was undertaken as a final year university project, therefore all work done was completed soley by myself. Having learnt from previous projects and theory based excercies, understanding how to conduct myself throughout the whole project wasn't as burdensome, but as with all projects there were a few hurdles along the way. Therefore, my role during this project consisted of being a consultant, project manager, UI/UX designer, front/back-end developer and QA tester.

Project Management

The Project Management aspect was the most meticulous and crucial part of this project, it is also where some of the pitfalls of the project were located, and an area in which lessons were learnt from. A major lesson that was learnt during the project, never as a designer get attachted to initial wireframes / mockups, it was the area that had led to further delays in my project, because of how long I spent on perfecting things that didn't need to be perfected.

Motive8 project gantt chart


The research that was conducted for this project in order to perfectly execute the clients vision of their new solution, was based primarily on the following five methods:

  • Qualitative & quantitative research.
  • Questionaires & surverys.
  • Action research.
  • Participative observations.
  • Competitor analysis.

Based on the above research conducted with the clients, user personas, journeys and flows were then possible to make, resulting in low and high fidelity wireframes. As I knew from past project experiences, poor research and planning will always result in an incomplete or a completely different product the client asked for. As a result, more in-depth research and project planning methodologies were conducted:

  • Functional requirements.
  • Questionaires & surverys.
  • Action research.
  • Participative observations.
  • Competitor analysis.

"Suliman has a really professional approach to his work, working to targets and deadlines. He made the process of our website really easy with step by step formulation of ideas, wants and needs."

- Melissa Simpson (Director)

Project management & client research documents

Understanding the Client

Having completed the research needed to understand the clients business processes, it was time to understand who exactly I am designing and developing for. Collating all the research that was needed and conducting further primary and secondary research with the client, I understood that there were a total of three final end-users of the deliverable required. Potential students, parents / guardians & the learning centre administrators.

Motive8 user personas


There were a number of challenges and limitations during the course of this project, time constraints (being an assessed university project, as well as having 2 other module assessments and lectures to do) and knowledge of both front and back-end technologies were some of the contraints placed on the project. The following were other challenges encountered during the project:

  • Renegotiating the initial project plan.
  • Managing a complete re-design and development of a website.
  • Implementing dynamic features within the website.

Challenge #1

The initial project was to create a fully functioning CMS for the organisation, due to time contrainsts this requirement had to be negotiated with the client.

Seeing as though I had a total of 5 months to complete the project, and also manage my other university assessments, the initial project requirements had to be reconsidered with the clients. The challenging aspect of this problem was to calmly and professionally discuss the constraints with the clients, justifying my reasons for not persuing the CMS. Instead, to focus my efforts into providing the business with a complete and functional solution.

Motive8 project requirement agreement

Challenge #2

Completely designing and building the websites current features as well as creating and implementing new user experiences for end users.

Designing an existing website, analysing what is needed and what isn't, incorporting a new front-end but also accomodating client requirements and needs, were some of the difficulties I came across in the design and development phase. Multiple iterations were made with the low fidelity wireframes, prototypes were made in each sprint, each one in more detail, in support of the clients exact requirements. The main challenge was accomodating the clients requirements and needs but also ensuring there was no room for any scope creep.

Motive8 use-case diagram

Motive8 wireframes

Motive8 mockups

Motive8 stlyeguide

Challenge #3

Researching, learning and implementing back-end technologies with little to no prior experience.

Understanding my time limitations and how much needed to be done to complete the project successfuly, research had to be done to ensure the right technologies were being used. Initially, the idea was to use the PHP Laravel Framework for the back-end of the website,but only having 4-5 weeks for both the design and development phase, learning, experimenting and implementing this framework didn't seem feasible. Therefore, using PHP and MySQL for the back-end of the website was implemented as prior knowledge and experience had been aquired.

Motive8 website back-end website planning


With the design and development phase of the site completed, the testing phase began, with only a limited number of days to complete the entire site testing, front and back-end, I had to divide the testing sections into bitsize chunks in order to check everything off the list.

  • Quality Control and Assurance Testing.
  • Performance Testing.
  • Security Testing.
  • Usability Testing.
  • Interface Testing.
  • Documentation Testing.

"Suliman provided us with a website that suits our business with the functionality needed. All in all he made it a pleasant process and really opened our eyes to website design."

- Melissa Simpson (Director)

Keighley R.U.F.C Marketing Campaign

A freelance project that included indoor and outdoor banners for club promotions.

© Copyright 2018 - Made with ♥ in Bradford, UK