Café Analog App

App Design - Graphical Work - Volunteer Work


This app was designed for the student café (Café Analog) at the IT University. It is used by the customers of Café Analog to pay for coffee and other hot drinks, using the (now virtual) punchcards, which can be purchased and used through the app. The app design was made with base in the current aesthetic of Café Analog. Furthermore, it contains sprinkles of gamified elements as well, for example a leaderboard of who consumes the most coffee during a semester.

In this project, I had the role of lead designer. It was developed by the Analog I/O team.

AnalogIO_SeveralPhones.png

Cross-disciplinarity

The app was made in a cross-collaboration with a team of developers and designers. As it was a volunteering team, most of the participants were baristas from the coffee shop themselves, which helped in providing valuable information e.g. which orders were the most common (or the most complicated). Through this, various scenarios (user-flows) were constructed, and used to test the functionality of the app. Furthermore, iterations of the app were continuously usability-tested on and by the coffee-drinking students at ITU.

The overall aesthetics of the app was designed in collaboration with the Analog Graphics Team, to ensure a cohesive visual throughout the communication channels.

 
analogio_mockup_web.png

Prototyping Process

Prototypes of the app were designed in Figma. In Figma, wireframes were made pre-visual-design, which were used to uncover and discuss the functionality and flow of the app itself. Following this, graphical assets were made in Adobe Photoshop and Adobe Illustrator, which were used to then build a hi-fi prototype in Figma. The hi-fi Figma prototype served as the base from which it was developed. Naturally, the developers were consulted continuously throughout the prototyping process, so that 1) they could begin working on researching the more tricky features before the design was “finished”, and 2) so that we could gain extremely valuable inputs on which aspects were technically feasible (or not!) for this development team.

Previous
Previous

MaldivesFinder.com

Next
Next

UX/UI Experiment - GoodReads