Month: March 2016

CoffeeBoy Skeleton: Mock-ups, Part I

CoffeeBoy Skeleton

The CoffeeBoy UX design process reached the skeleton plane! Here we’ll replace the abstract concepts which we’ve developed on the structure plane with concrete UI elements. Our design work will now be characterized by the creation of UI mock-ups. In this post we’ll shortly clarify our goals on the skeleton plane and then create mock-ups giving us an idea of how the layout and the different feedback types will look like in the UI.

Read More

CoffeeBoy Structure: Layout

CoffeeBoy UI Layout

After we’ve accomplished a use case-driven distribution of data and functions across multiple views and created a site map, it’s now time to concentrate ourselves to the look of the individual views. Thereto we want to follow the Material Design guidelines. In this post we’ll first decide which screen widths we plan to support and then create a responsive layout which considers each of these screen widths.

Read More

CoffeeBoy Structure: Feedback Concept

Feedback Types

Thinking about what possibly could go wrong during the use of a UI can be a rather tedious task. However, only focusing on the happy paths and disregarding problematic conditions can lead to a UI presenting the user none or awkward feedback. We want to spare our users such frustrating moments. Therefore in this post we’ll create a feedback concept for CoffeeBoy supporting and not confusing or even blaming our users.

Read More

CoffeeBoy Structure: Site Map

Site Map

The use cases that we’ve covered in the last 15 posts already included the CoffeeBoy UI views, their contained data and functions as well as the navigation cases between views. What’s still missing is the big picture of the UI’s structure, showing the entry points of the navigation (candidates for items of the main navigation menu) and the hierarchy of all views. In this post we’ll paint this big picture by creating a site map.

Read More