housette_logo

Housette

A Smart Home application designed to monitor and control a range of smart devices
quickly and easily, equipped with an elegant navigation system

The Galaxy S7 image used in the video has been created by Daniel Bolyhos: https://dribbble.com/dxbolyhos



Prologue


"Walls are covered in imagery. Mood boards are created around the emotional qualities of aspirational outcomes. User stories, personas, scenarios, and other means of aggregation provide an enormously useful guide into what must be accomplished to make something great for the customers. But then, the creativity stops.The amazing stack of unique problems is forgotten. The rich pile of specific insights disappears. Instead, from the unique opportunities emerges the expected. Organic insights are morphed into mechanical results. One of a kind is turned into a square peg for a square hole. Because screens come before problems."



“…so often we throw away our best stuff, our opportunity to do something new and different, the very moment that marker hits whiteboard."




– Golden Krishna "The Best Interface Is No Interface"


As the author of the book "The Best Interface Is No Interface" argues, there are many new and wonderful app ideas that offer truly new user experiences. However, when it comes to designing User Interfaces for those fresh UXs, designers come back to follow already seen, perhaps even worn out methods, instead of bringing new UIs alongside with those new UXs. Thus, when designing the ‘Housette’, I wanted not to follow all the user interface guidelines and patterns, the goal was to come up with an elegant design element that would make an app quicker to navigate and diversify already well known ui patterns.
The design had to be quick, have as minimum of user interaction as possible and at the same time be most productive. Less time it takes to complete any task – the better. Thereby, the main “quick control” page allows to access essential controls of all devices without the need of going through separate pages of each device.
Navigation: When looking at user flowcharts, for me, it’s so easy to see the path I have to follow to get to a wanted place. But that takes more time when looking at finished pages; pages with stocked up images, accumulated text, information and more navigation options. That simplistic view on apps that the user flows have, is what I tried to bring into my app design.
The problem: If a user is familiar with the app and simply wants to get from a page A to page B, the page B may be more than one tap away. On mobile devices where many parts are hidden in some menus and navigation is broken down to many subsections as keeping it all on one page would takes up the whole space, clutter the screen and confuse. Basically, there might be lots of taps and lots of scrolling to be done to get to that page B. If there is no important information to read and no important data to be collected on those ‘in between’ pages, going through them becomes a tedious, time consuming routine.
The bubble navigation is likely to be not very clear when opening an app for the first time. But when knowing the app well enough, the bubble navigation may be a more elegant way to navigate, especially on smaller screens. The Bubble navigation is similar to 'Fast Travel' often seen in videogames. Similarly to how the 'Fast Travel' allows players to instantly move to a specific location in a game without having to travel across the map, bubble navigation allows to instantly move to any page in the app skipping those pages in between. Of course some locations would not be available for ‘fast travel’ if a prior page requires some important user data input in order to proceed. The bubble navigation removes the need of loading multiple pages, no need of going back multiple times to get to the page you have passed some number of pages ago. A user gets the whole image and sees all abilities of an app, as some, perhaps less significant parts may be less visible. Though this navigation may be more convenient to use, I see it rather being an optional addition to already existing partners.