Skip to main content

Documentation Index

Fetch the complete documentation index at: https://docs.cognite.com/llms.txt

Use this file to discover all available pages before exploring further.

These guidelines define the quality standards that Flows custom apps must meet for certification. Use this reference when conducting self-assessments before submitting applications for Builder certification.

​
Design quality assessment

The design quality assessment evaluates user experience, interface design, and usability through 10 key questions based on established UX principles. Target score: 3.8 or higher average across all questions.

​
Self-assessment process

​
Step 1: Confirm the user and tasks

Before opening the app:
  1. Define the primary user: Identify the specific role and context (e.g., “Maintenance engineers on offshore platforms”)
  2. List key tasks: Document 2-3 critical workflows this user needs to complete (e.g., “Check pump vibration alerts”, “Schedule maintenance work”)
  3. Gather context: Note the user’s experience level, time constraints, and success criteria
This step is crucial - the quality assessment is only as useful as the clarity of the user and tasks it’s based on. If these aren’t well-defined, stop here and create them first.

​
Step 2: Walk through each task end-to-end

Task-based evaluation:
  1. Open the app as that user: Use a clean browser session with representative test data
  2. Complete each task from beginning to end: Click through every step without shortcuts
  3. Focus on task completion: Don’t evaluate screens in isolation - only findings that affect task completion matter
  4. Document pain points: Note where users get stuck, confused, or make errors

​
Step 3: Score the 10 questions

Assessment process:
  1. Apply the scoring criteria: Use what you observed during task completion to score each question 1-5
  2. Focus on critical areas: Questions 2 (navigation) and 6 (error prevention) require walking the tasks and can’t be assessed from code alone
  3. Calculate your average: Sum all scores ÷ 10
  4. Identify improvement areas: List any questions scoring under 3 for immediate attention

​
The 10 design quality questions

Question: Are you using Aura tokens, layouts, components and patterns correctly?5 - Excellent: All Aura tokens are applied correctly, no hard coded values are used. The app uses proper responsive sizing and page layouts. Aura components are used without style overrides. Component best practices followed. Exceptions allowed for component needs not found in the system. Patterns align with design system guidelines.4 - Good: Mostly using Aura tokens and components with 1-2 minor exceptions. Layout spacing mostly consistent. Minimal style overrides that don’t break patterns.3 - Average: Mix of Aura and custom elements. Some proper spacing, some random values. Using Aura components but overriding styles in multiple places. Some best practices ignored.2 - Below average: Frequently using custom colors, typography, or spacing instead of Aura tokens. Heavy component customization that breaks design system patterns.1 - Poor: Not using Aura design system. Custom colors, fonts, spacing throughout. Building custom components instead of using Aura. No adherence to design system guidelines.
Question: Can users tell where they are and navigate easily? Are elements organized with clear visual hierarchy?5 - Excellent: User’s current location always clear. Easy navigation forward/back. Menu structure consistent. Related items clearly grouped. Strong visual hierarchy guides attention. Content flows logically (F/Z pattern).4 - Good: Usually clear where you are. Navigation mostly consistent. Good grouping and hierarchy with minor exceptions.3 - Average: Sometimes unclear what page you’re on. Navigation works but isn’t always intuitive. Some grouping makes sense, hierarchy exists but not always clear.2 - Below average: Often lost or confused. Navigation changes between pages. Poor grouping and weak visual hierarchy - everything looks equally important.1 - Poor: No indication of current location. No clear way to navigate. Inconsistent structure. No logical grouping or visual hierarchy.
Question: Are buttons, inputs, and actions labeled clearly? Can users understand what everything does?5 - Excellent: Every element has a clear, specific label. Language is plain and action-oriented (“Save changes”, “Delete item”).4 - Good: Most labels are clear with only minor ambiguity. Language is mostly plain with minimal jargon.3 - Average: Labels are present but sometimes vague (“Submit”, “OK”). Some unnecessary jargon used.2 - Below average: Many labels are unclear or generic. Heavy use of technical terms without explanation.1 - Poor: Labels are missing, confusing, or use jargon that users won’t understand.
Question: Do users know what’s happening? Are forms easy to use with helpful validation and error messages?5 - Excellent: Immediate feedback for actions. Clear loading states. Helpful success/error messages that explain what happened and what to do next. All form fields are clearly labeled. Required fields marked. Real-time validation with specific, actionable messages. Easy to correct mistakes.4 - Good: Most actions provide feedback. Loading states present. Form fields well-labeled. Validation is mostly helpful with minor timing or clarity issues. Error messages are generally clear.3 - Average: Some feedback provided but not consistent. Loading states sometimes missing. Fields labeled but some unclear. Basic validation present. Error messages are generic and could be more helpful.2 - Below Average: Minimal feedback. Users often don’t know if actions worked. Unclear what fields need. Validation only happens on submit. Unhelpful error messages.1 - Poor: No feedback. Silent failures. Technical error codes without explanation. No labels or requirements shown. No validation or only shows errors after multiple attempts.
Question: Is it obvious what’s clickable? Do interactive elements respond appropriately?5 - Excellent: All clickable items look clickable (buttons look like buttons). Hover effects on interactive elements. Cursor changes appropriately.4 - Good: Most interactive elements are obvious. Hover effects mostly present. Minor inconsistencies.3 - Average: Some clickable items look clickable. Inconsistent hover states. Occasionally unclear what’s interactive.2 - Below average: Many interactive elements don’t look clickable. Few or no hover effects. Confusing interactions.1 - Poor: Can’t tell what’s clickable. No visual feedback on interaction. Elements that look clickable aren’t.
Question: Can users undo or cancel destructive actions? Are there warnings before important actions?5 - Excellent: Confirmation dialogs before destructive actions. Auto-save prevents data loss. Clear undo options or cancel buttons.4 - Good: Most destructive actions have warnings. Some auto-save or undo capabilities.3 - Average: Some warnings present for major actions. Limited undo/cancel options. Some risk of data loss.2 - Below average: Few warnings. No undo options. Easy to accidentally lose work.1 - Poor: No warnings. No way to undo or cancel. Frequent accidental data loss.
Question: Does your app work well on different screen sizes? Is it usable on desktop, tablet, and mobile?5 - Excellent: Seamless experience across desktop, tablet, and mobile. Layouts adapt appropriately. Touch targets are 40px+ on mobile. Text readable on all screen sizes. Navigation optimized for each device. No horizontal scrolling. If app is not used on mobile/hand-held device, it should be hidden, or functionality should be limited to prevent a poor user experience. Are hover states accounted for in mobile/touch devices so users can still access the same content without the ability to hover. Smooth behavior allows for relevant content to remain visible on mobile devices when native elements, such as keyboards, are present.4 - Good: Works well on most devices. Layouts adapt with minor issues. Most touch targets are appropriate. Generally readable and usable across screen sizes.3 - Average: Functional on multiple devices but not optimized. Some layout issues on smaller screens. Some touch targets too small on mobile. Horizontal scrolling sometimes required.2 - Below average: Poor mobile/tablet experience. Layouts break on smaller screens. Many touch targets too small. Text hard to read on mobile. Significant usability issues on non-desktop devices.1 - Poor: Only works on desktop. Completely broken on mobile/tablet. Unusable on smaller screens.
Question: When there’s no data, is it clear what to do next? Do empty pages guide users? Can users easily request access or share data (invite) with other users?5 - Excellent: All empty states show helpful messages and clear next steps. Simple graphics guide users. First-time users know exactly what to do.4 - Good: Most empty states are helpful. Generally clear what to do first. Minor gaps in guidance.3 - Average: Some empty states explained. First-time users can figure it out with effort.2 - Below average: Many blank pages with no guidance. Unclear how to get started.1 - Poor: Blank pages everywhere. No indication of what to do or why nothing is showing.
Question: Does the app load quickly? Can users complete tasks efficiently? Are there shortcuts for common actions?5 - Excellent: Fast loading with progressive content display. Bulk actions available. Keyboard shortcuts work. Common tasks take minimal clicks.4 - Good: Reasonable loading times. Most tasks are streamlined. Some efficiency features present.3 - Average: Acceptable performance but could be faster. Tasks require moderate effort. Few shortcuts.2 - Below average: Slow loading. Tasks require many steps or clicks. No shortcuts or bulk actions.1 - Poor: Very slow or unresponsive. Tasks are tedious and require excessive clicks. No efficiency features.
Question: Can people use your app with technology assisted devices, such as screen readers and keyboard inputs? Are there focus states and do they navigate across the page correctly? Does it meet WCAG AA 2.1 standards?5 - Excellent: All interactions work via keyboard (Tab, Enter, Escape). Text contrast meets WCAG AA (4.5:1 for normal text, 3:1 for large text). Clear focus indicators on all interactive elements. Proper ARIA labels for screen readers. Images have alt text. Clickable areas are 40px+ for touch, 20px+ for mouse. Form errors announced to screen readers.4 - Good: Most accessibility requirements met. Keyboard navigation works for nearly all features. Contrast meets standards with 1-2 minor exceptions. Focus indicators mostly visible. Most ARIA labels present.3 - Average: Basic keyboard support but missing for some features. Contrast mostly acceptable but some failures. Focus indicators are present but not always clear. Some ARIA labels missing. Clickable areas sometimes too small.2 - Below average: Limited keyboard support. Multiple contrast failures. Weak or missing focus indicators. Few ARIA labels. Many clickable areas are too small. Screen reader experience is poor.1 - Poor: No keyboard navigation. Poor contrast throughout. No focus indicators. No ARIA labels. Not usable with assistive technologies.

​
Quality scoring

Each question is scored on a scale of 1-5, then calculate your average score by dividing the total by 10.
Average scoreQuality levelRecommendation
4.5 - 5.0Excellent - ready to launchYour app meets high quality standards. Minor improvements can be made over time.
3.8 - 4.4Good - launch with minor fixesYour app is functional and usable. Address the lower-scoring areas before or shortly after launch.
3.0 - 3.7Average - needs improvementYour app works but has significant usability issues. Fix major problems before launching.
Below 3.0Needs significant workYour app requires substantial improvements before launch. Focus on the lowest-scoring areas first.

​
Further reading

Last modified on May 12, 2026