Skip to content
This repository has been archived by the owner on Mar 20, 2019. It is now read-only.

UI Notes

Jump to bottom
castrog edited this page Mar 27, 2012 · 5 revisions

UI Notes

Quick page to collect notes from our UI meetings and get the process of designing the UI started.

While we're thinking about the Whenbot UI we should consider the major pain points in ifttt. This is our opportunity to learn from them and hopefully design something that's easier to use.

ifttt annoyances

  • Too many steps while creating new task
  • Difficult/annoying to go back
  • Can't just scroll up and reselect channels, for example
  • No indication of what channels are active while creating new task
  • No quick summary of the active tasks in the dashboard

UI Proposals

Dashboard

The dashboard is our landing page so we want to show the most important information in summarized form. We're proposing a carousel-like listing of all the activities (maybe just active ones) and a quick activity log which will show a quick summary of the last trigger:

Whenbot Dashboard - Proposal 1

The My Activities carousel would have a "droplet" for each task containing:

  • Short name
  • Some sort of icon to indicate last time triggered
  • Maybe the icon fades with time or changes colour
  • Icons in the droplet to indicate channels for trigger (left) and action (right)
  • If we consider doing a task with one trigger but multiple actions we can have the action icon be a combination of the respective channel icons
  • I'm thinking along the lines of iOS folders
  • Clicking on a task will take you to that task's page for more details
  • New action button would be somewhere in the carousel (possibly top right)

The Activity Log will contain:

  • Quick summary of most recently active tasks (~10)
  • Successful and failed triggers listed in chronological order
  • We should investigate grouping in "relative time" groups
  • Today, yesterday, earlier....

Channel Listing

We're thinking of improving on the ifttt approach by clearly labelling active channels as opposed to just list everything together. Some ideas we're throwing around:

  • Group into Active vs Others
  • List them together but distinguish active ones
  • Active in color vs Others semi-transparent (or gray)
  • Active channels have a badge

In order to make it easier to explore the channels we should provide quick information (possibly on hover), w/o requiring an extra click.

Clone this wiki locally