Design Process Summary

 Design Process Summary

To help recap which HCI-techniques we have used, we will summarize the design process in this blog post.

Problem Analysis and Field Studies

At the beginning of our project we went out to observe our route. We wanted to gather ethnographic data i.e who were travelling, why, and when.  We followed a heuristic approach, given our short time to gather data. After conducting semi-structured interviews with people on the route we found out that one big group of people travelling were tourists. We chose this as our target group. After deciding target group we wanted to establish user requirements, which turned out to be quite difficult. Everyone liked the route, and had almost nothing (or irrelevant) things to complain about. However, a reccurring pattern was that everyone enjoyed the view, this was said in the majority of the interviews. We decided to capitalize on what they already enjoyed, instead of something they didn't like. We wanted to design something that incorporated the view.

Persona and Scenarios

Based on our interviews and the data recorded, we came up with two personas. An international tourist and a domestic tourist were created and their respective scenarios were based on the target group's requirements. The scenarios envisioned situations in which the persona would be placed in an everyday context and where the behaviour and possible motivation of our target group could be anticipated. To accommodate our persona and scenarios we made a list of pain points to identify opportunities for improvement and potential issues. 

Designing and Prototyping

We had a brainstorming session to come up with features to include in the application.

We then split into two groups and made two parallel design ideas using sketches. After that we compared the two designs, which were relatively similar, and combined the ideas we liked best from both designs and made a paper prototype. We decided to move buttons to the bottom of the screen, both to make them easier to click when holding the smart phone, and to make the image showing the view as large as possible. We went through several cycles of prototyping. We remade the sketches and used them in our low-fidelity prototype using PopApp.  For our high-fidelity prototype, we used Flinto. 
Here is the final prototype.

 Design Critique and Design Iteration

Our product is developed using an iterative design process. This means that we have kept modifying and refining our prototypes after testing and getting feedback. Our first idea, some kind of photo app with image recognition, came from our field studies where we figured we wanted to enhance what people liked about the boat. Unfortunately the expert evaluator we got didn’t give us much constructive feedback at first. Instead, we used the feedback we got from our teacher assistant to create our History mode, the thing that we think makes our product stand out. After the Evaluation we started building a Popapp surrounding our ideas. When designing we tried to follow Nielsens 10 Usability Heuristics to the best of our knowledge. When we developed our lo-fi prototype, we looked to our own preferences and what we thought was intuitive, but when we did our think-aloud tests we realized what was intuitive for us wasn't necessarily for others. For example, we thought that sliding between screen would be simple and easy to figure out, but it turned out it wasn't as obvious to others, e.g. our parents. Therefore we decided on descriptive buttons in our final design. The same reason lies behind the picture on the camera button, as one user didn't realize it was a camera at first. After getting some final feedback regarding design details during our last presentation,  we decided to change some colors and move the camera button higher to prevent miss clicking and increase functionality.