This github project has been produced as a response to assessment item four in the course DECO7350 Social Mobile Computing at the University of Queensland.
From the beginning of this project, our team set out to explore how technology could be used to help people in terms of food planning to achieve a healthier and more sustainable diet without the increased mental effort of doing so. Through our research we found a lack of food literacy and assumptions where it was believed that healthy and sustainable food would be costly and likely to not taste as great. From this, our design team devised what we believe to be a suitable solution by working through an iterative design and prototyping process to understand and produce a product based on users' needs.
This repository consists of the source code for the high-fidelity prototype showcased at the trade show towards the end of the semester and a wikipedia where all documentation can be read.
https://muffin-madness.firebaseapp.com/
https://github.com/deco3500-2019/muffinmadness
https://github.com/deco3500-2019/muffinmadness/tree/master/Promotion%20Material
https://github.com/deco3500-2019/muffinmadness/wiki
https://github.com/deco3500-2019/muffinmadness/wiki/Proposal
https://github.com/deco3500-2019/muffinmadness/wiki/Documentation
https://github.com/deco3500-2019/muffinmadness/wiki/Relevant-Theory
https://github.com/deco3500-2019/muffinmadness/wiki/Design-Process
https://github.com/deco3500-2019/muffinmadness/wiki/Prototype
https://github.com/deco3500-2019/muffinmadness/wiki/Standups
https://github.com/deco3500-2019/muffinmadness/wiki/User-Research
https://github.com/deco3500-2019/muffinmadness/wiki/References
If you wish to see a live version of the high-fidelity prototype follow this url: https://muffin-madness.firebaseapp.com/
To serve the project on your local computer follow these steps:
Required: 1. Node.js installed on your device, 2. a code editor or IDE.
This application is a high-fidelity prototype made with a mobile first approach. The current format of the application have only been designed for phone sized deviced, spesifically the Google Pixel 2 XL device. The following steps will detail how you can host the application on your local computer and view it in your browser and on your phone.
- Open up this project in a code editor or IDE.
- Open up the terminal and run the following command:
npm install
- When the installation is complete, run this second command:
npm run serve
-
The page is best viewed on a mobile phone. If you however prefer to view it on the computer, continue to step 5. To open up the application on your phone look for the network address in the computer terminal and enter that adress into the phone browser url field.
-
To see the application on your computer either follow step four, but instead of using your phone, do the same on your computer, or open up your web browser to http://localhost:8080/. Note, your terminal might tell you differently.
-
Open up the developer inspect tool. If you use google chrome you can right click and click inspect towards the bottom or use the following hotkey combination:
ctrl + shift + i
- Once the inspector is open, click the toggle device toolbar button in the upper left corner of the inspector window or use the following hotkey combination:
ctrl + shift + m
- Continue to select Pixel 2 XL from the dropdown menu which normally is set to responsive. This can be found on the far left on the device toolbar that comes up after you finished step 6.
We in team Muffin Madness would like to thank you for your time looking at our project. It is a rare thing to get people's attention in a world of constant distractions and we appreciate that you are spending your valuable time having a look at our project.