Before going ahead and building my final prototype I decided to explore the technical aspects, and logic, of how each piece would fit together. A rough prototype would give me something to user test before investing a lot of time in my web application. This means that I will avoid having to make major structural changes (or scrapping pieces entirely) later on in my project depending on user feedback. In order to build a technical prototype I put together:

  • Important site content
  • Necessary site pages
  • Research findings
  • Rough wireframes

To guide me as I started to piece together the puzzle of how each element would fit together.

 

I used Visual Studio MVC and used a combination of HTML5, CSS3 and C# to build the site. I focused on creating a stripped down skeleton using Twitter Bootstrap to give a feel for how the site will eventually work and feel. This helped save time and allowed me to focus on pulling together the technical aspects that would serve as a foundation to my application.

My previous step

Wireframes & paper prototyping

Read more