Principles

With these principles:

• We strive to a set of common ideas which enable us to work towards the same goals;
• We can narrow down focus areas and prioritize our work;
• We can communicate to members outside the ux group what we are working on and what we feel is important.
• We recommend reading this article for more information about accessibility.

Short explanation of our principles

• Consistency and standards - Pages and functions should look and behave similar to make the user comfortable in how to work the system.
• Predictability - The user should not have to think how something works.
• Digestibility - Easy to consume the information given.
• Clear mental model - Easy to understand the Funnel concepts.
• Visibility of system status - Direct feedback on acted on actions, like success or errors.
• Speak the users’ language - Keep the Funnel tone.
• Fast responding system - Don’t keep the user waiting.
• Good and modern looks - Give a polished feel.

Consistency and standards

• Users should feel “at home” working with the system
  • E.g keeping save buttons at the same place in forms makes it easier to find without having to think and the same goes for having them in the same color and size
• Avoid confusion and anger when things look and feel different between pages
• A consistent experience helps build trust in the product
• Don’t reinvent the wheel - use established interaction patterns
  • This goes for both “global” patterns (logo located top left) and “local” patterns (forms in Funnel have a blue action button)
  • Our users spend most of their time in other systems than Funnel; using the same patterns as those systems will help them be more efficient in Funnel too.

Predictability

• The system should behave as expected by the user
  • E.g, it should be obvious what will happen when clicking a button
• It should be hard to do the wrong thing, but rather obvious how to do it right
  • Help user understand implications of their choices
• User should not be afraid to experiment
  • E.g, make the user feel safe to fail by providing safety nets (undo, restore, preview…)
• The system should never lose any data inputted
• The user should feel efficient when using the system
  • E.g, easy to find the right action and little effort performing it

Digestibility

• It should be easy to take action on a page
  • It’s frustrating when not directly understanding what’s being displayed and how to find what’s being searched for.
  • Google sheets list page is example where too much info is shown causing big list items and hard to get an overview.
• Only show key information
  • Hide advanced options, expand relevant options when they are needed to avoid user of being overwhelmed.
  • Avoid (long) explainer texts.
  • E.g finding data sources with errors.

Clear mental model

• Always help the user see the big picture
  • E.g, by visualizing for users how different concepts relate to each other
• Use navigation to communicate the core concepts of the system
• The key task flows should be easy to understand and follow
• It should be easy to navigate the system using this mental model
  • E.g, finding fields in transform looking at the menu
• Help the user create a mental model of the system that matches how the system actually works
  • Makes it easy to troubleshoot, learn new features and find solutions to new problems

Visibility of system status

• There should be clear feedback on actions
  • E.g, indicate when saving and display success or error messages when complete
• Changes should be transparent and understandable
  • E.g, a change log to know who changed what
• Problems and errors should be easy to find; it should also be obvious when everything is fine
  • E.g, a stale data source, failed export, or broken custom metric formula

Speak the users language

• Text should have the proper Funnel tonality
• The language should match between the system and the real world
  • Use the same wordings as when we speak and avoid synonyms or making up different terms for the same thing
  • Where possible, use the same terms as other systems our customers use
• Use the same language/wording between systems
  • I.e. between funnel.io, app.funnel, emails and help articles
• A consistent and easy-to-understand language builds trust with the user and makes it easier to learn how the system works

Fast responding system

• No one likes to wait more than needed, the same goes for our clients
• The UI should respond quickly to actions (scrolling, clicks)
• Display feedback fast; when things breaks show errors directly
• Fast response times from the server when editing and saving makes for a good user experience

Good and modern looks

• Keep up with the rest of the world for how a modern application should look to give users the feeling they are using something polished
• Users tend to have more patience and trust in a pretty product
• Usability comes before good looks, if in conflict