- I felt my previous wireframes didn’t entirly comply with the theme I set out for FilterBee – an app that is to be warm, friendly and fun and easy to use.
- Felt the reasons were because previous wireframes were really locked around the complex features and filter options.
- The interface reflected this through text heavy and content heavy systems.
- heavy use of bold colour pallet with a vibrant orange, yellow and black made it overwhelming to look at in addition to all the buttons, features and text on the interface
Went back to sketches and tried to develop an interface that would be centered around a more visual experience.
- showcase the filters using icons
- less text interactions and more interactions revolved around gestures and universal icons
- de-clutter and minimize the amount of buttons
- softer background colour to place emphasis on buttons
- elements that related back to the bee theme
Beehive – Menu Navigation system
The navigation system takes the idea of beehives being the all-in-one gathering hub for bees; shelter, womb, their working station. In the context of the app, it is a hub for all the features and areas of the app such as Filters, Settings, NFC Tag manager, Profile, Groupings. The little Beehive icon is located on every page of the app on the top left corner where it can be accessed at any time to navigate from one area of the app to another.
The new design of the filter page offers a more immersive browsing experience. Participants are still able to sort how they’d like to view the filters: by category, by location, by time.
The ‘Sort By Category’ would probably be the main way for people to interact with the filters. We associate filters with the context we’d use them in and actions/activities we’d be doing in that context. So I decided to include a vertical scroll that allows you to browse through filters based on where they lie on the line, from the top being filters associated most with social activities, and the bottom being filters associated with rest, work and productive tasks.
Filter Page Cont (Sort by MAP VIEW)
- viewing the filter by map view allows you to detect areas around you that you have tagged with a filter. These areas are highlighted with an orange pin, when clicking on a pin, it allows you to view the tagged name of the location and additional filter settings.
- You can also search for specific locations you’ve tagged using the search bar, or view locations you have favourited (heart icon). This could be useful for quickly locating filters that you find yourself using often, filters GPS tagged with your home, school, workplace, etc.
Filter Page Cont (Sort by TIME VIEW)
Sorting filters by time gives you the ability to view filters you have scheduled throughout your current day, filters that are coming up in the following week, and filters in the following month.
Day filter view – filters that touch upon very specific and detailed hourly scheduled tasks. Could follow your daily routined schedule such as having a filter to adapt to you: walking your dog in the morning, commuting to work, working at work, your lunch break, etc.
Week filter view – filters that may outline repeating weekly routines. Would be ideal for unchanging weekly tasks such as certain lecture classes you have every week, or weekly meetings with co-workers, etc.
Month filter view – filters that may be needed for more sparse and occasional use, perhaps a one-time occasion. An example would be for a specific meeting scheduled for a certain day and time.
Filter ON page
- I began looking at different ways to indicate the amount of time left before a filter runs out. Certain filters can be set to apply themselves to the phone at an indicated time, and shut off after a certain time frame.
- I looked at interpreting this data in a digital clock view and then in an analog clock view. I felt the analog clock does a better job in the sense that it visualizes the data better.
- we tend to interpret time better in an analog format as it allows us to recognize and see the passing of time from a proportion whole.
- it is able to indicate the amount of time that has passed since the filter has turned on and the amount of time left. Whereas the digital clock only indicated a countdown timer of the amount of time left.