The Task
The task of this assignment was to create a prototype with a specific set of guidelines. The prototype had to be a “look and feel” prototype with a clear filter dimension in mind when designing it. It should also have a clear level of either high- och low-fidelity.
When we had come up with a prototype that met the requirements we also had to make a screen recording of the interaction.
Results
I created a look and feel prototype that focuses on the filter dimensions appearance and spatial structure.
The prototypes concept is very simple and underdeveloped, since the focus of the assignment was to create the prototype itself and not perfect the concept. The prototype I came up with is supposed to be a website for jobseekers (and companies that are hiring) where you can apply for jobs and instantly get set up with an interview with the company. The website collects all the upcoming interviews in one page so you can easily see when your interviews are scheduled, with which company and prepare for them. The webpage focuses on making an instant connection between the jobseeker and the company to reduce the waiting time between seeking a job and actually getting to talk to the company that are hiring.
You can test out the prototype yourself here:
https://projects.invisionapp.com/share/PXZ7KUNVRMD#/screens
Designprocess
When working on my “look and feel” prototype, I focused on having a low degree of interactivity. I used Adobe Photoshop to create and design the pages and completed the prototype in InVision with an interactivity that only extends to the use of hotspots via a fixed-path prototype. This means that the person who looking at the prototype can only get from point A to point B in the prototype, which makes the interactivity limited. The reason I chose to
focus on a low degree of interactivity in my look and feel prototype is because I wanted to focus on a few specific filter dimensions, and in this case interactivity was not an important part of the prototype.
I chose to work with the filter dimensions “Appearance” and “Spatial structure” for my look and feel prototype. I found InVision to work well for rendering and express these filter dimensions. The filter dimension “Appearance” refers to how the prototype looks. Within this filter dimension, things like colors, size, shape, margins and so on is the important part of the prototype. “Spatial structure” is a filter dimension that refers to the prototype’s arrangement of the interface or of the information elements.
So in my prototype overall, I wanted to focus a lot on the color scale and the structure of the interface and margins between information elements. This worked well with using Adobe Photoshop and InVision as tools to make my prototype. I could make the prototype files in Adobe Photoshop and then make the prototype interactive via the prototyping tool InVision, which merged all the files into a coherent and working prototype.
Below is a video of the interaction and look of the initial prototype before I fixed a few details. The finished and revised product can be viewed above.
Sandra's Design 