Design Process - Thesis 1
Thesis Concept
This project researches clear user interfaces in the domain of web resources to design an informational web app on skiing resorts for people who love the sport. My goal is to make a skiing resort platform with affordances, including resort statistics and weather reports, so that people may find and compare information on any place they inquire about. The website’s main interface will be a map allowing users to geospatially view the locations. The main content on the site will include the individual location’s facts, weather forecast, and a Google Map showing the runs and lifts on a map.
The current options for gathering information on skiing resorts are very dispersed with an overall lack of good user experience and web design. My website will emphasize on creating a uniform design displaying relevant information on skiing locations. During Thesis 2 the website will be user tested rigorously to make the necessary changes to its design based on its usability.
Research
The main focus of my research has been geared towards creating the best solution for skiers who want to research and compare skiing resorts. The first step in my research has been to analyze the current resources on skiing resorts. Then, to confirm that my research had identified the main available resources, a survey to skiers was sent out. Fifteen US college students and five middle aged men were asked to explain the resources they consulted before taking a ski trip. From both inquiries, my assumption that there is no one specific resource people use, was confirmed. I will try to build a website that contains the most useful features to skiers during their research and decision making process. In order to build this website I have been researching cartography and the web services that I can easily learn that will do the things I want them to do. Then I researched design elements to build the clearest and most pleasing responsive website.
The research for my thesis has also been focused on user interface design and user experience design, and more specifically data visualization and the use of dashboards to display as ample information in a simple manner. Lastly, my research has been focusing on API’s and Javascript to understand and learn how to implement third party data in my website. In order to use the API’s Node.js has been a focus of my research.
Some of the questions that shaped my project are:
What is necessary information for people who want to decide where to go skiing?
What kind of map should I use in order to display the most information without overwhelming the users?
Why are dashboards so popular? Why should I implement aspects of dashboards for my website layout?
Prototyping
The prototypes for my thesis firstly began with an emphasis on look and feel. The first two prototypes focused on design aspects such as color, typography and composition. The main characteristic the prototypes were prototyping was if the design was conveying trust and knowledge. After designing the aesthetic prototypes, the content of the website and usability became the focus. To understand the users, three user personas and two use case scenarios were created. The image below is from the inside page of my latests aesthetic prototype.
The last prototypes have been used to understand the technologies I will be using. The initial test was simply to receive data from the API On The Snow regarding a resort. The next technical test involved creating a search field with suggestions appearing in a dropdown. Afterwards, I began experimenting with the Google Maps API to understand what type of map I will be using and how to implement it in my website. The image below is of the latest technical prototype which includes a search field and the Google Map set on terrain view.
Technical Production Plan
Technically, this project will function with data received from the On The Snow API when a request is made from the client side. When a location is requested, data pertaining that location will be shown on a website. At the same time the Google Maps API will be used to show the location on the map.
The user will be able to search for locations using a search field which will have the locations either statically loaded or dynamically loaded depending on how easy it is to match what is being typed with the On The Snow API. In order to simplify the technology aspect of my thesis I will firstly create this service for Colorado. If there is time left, implementations for the US, North American and the whole world will occur accordingly. (On The Snow has data for all the resorts in the world).
Production Plan
December
-Improve the user scenario video
On The Snow API and Node.js working together
1) Document the service endpoints and description
2) Implement a Node.js module that is responsible for requesting from `On the snow` services.
3) Build a very simple client side web app that roughly visualized the user interaction with this app
4) Implement an express application that provides API endpoint for web clients all the services/endpoints I need
5) Verify the successful communication between client web app and my express app
6) Call the services provided by the Node.js module I developed in step 2/, as users ask for them from client app.
Jan 4-17
Google API with preset markers
Illustrate weather icons
Improve UX by conducting user tests
Jan 18-31
Combine the map with Snow API
Research React
Improve UI by conducting user tests
Feb 1-14
CSS + SASS
User test changes made if any
Feb 15-28
Make the website responsive
Research how Images API works
Research hosting options
Feb 29-Mar 11
Images API
Hosting
Buy domain name
Mar 12-25 (spring break)
Upload website to Product Hunt
Prepare for presentation
Mar 26-Apr 8
Finalize presentation
User tests with relevant stakeholders:
Winter Break: user test in Cervinia, a ski town in Italy. Before showing my website I can survey the users to understand their skiing habits and experience
Spring Break: user test at Peak Performance, a sports equipment shop in Oslo, Norway. I can set up a stand at the store near the alpine skiing section and ask people to user test my website.
During January and February I will continue testing my prototype with InVision. My strategy is to reach out to skiers I know and ask them to test my prototype while recording their screen and camera. I will also ask if they can ask their own friend whom ski.
For the final presentation I believe my project will benefit from being in the industry presentation since it will be an interactive website.