AI Workflow Dashboard
The interface uses a clean layout with soft gradients and clear sectioning to enhance readability and focus on key actions. However, the UI could improve on clearer navigation cues and better contrast for accessibility, especially in interactive elements and secondary controls.
Public
Design Score
Polish Opportunities
Design Perspectives
0To Review
Recommended Fixes by Impact
0Total
Fixes by Category
2
Color & Contrast4
Content Readability & Clarity3
Visual Consistency, Imagery & Media1
Navigation & Structure0
Conversion & Actions0
Tone, Friendliness & Delight2
Accessibility & Input Ergonomics2
Efficiency & Cognitive Load3
Flow & States Completeness2
Strategic DesignRecommended Fixes by Impact
0Critical
6Major
11Moderate
3Minor
Low contrast for subtitle text below main header
Major
Color & Contrast
The Problem
The subtitle text below the main header uses a mid-gray color on a light gradient background, resulting in low contrast likely below WCAG AA standards, making it difficult for users with low vision to read.
Why it Matters
Users with visual impairments or in bright environments may struggle to read this critical supporting information, reducing comprehension.
How to Fix
Increase the contrast by darkening the subtitle text color or lightening the background behind it, aiming for at least 4.5:1 contrast ratio as per WCAG AA guidelines.
Issue Highlights
Low contrast for placeholder/instruction text within input box
Major
Color & Contrast
The Problem
The placeholder or instructional text inside the main input box is a light gray on a white background, creating low contrast that likely does not meet WCAG AA requirements.
Why it Matters
Users may have difficulty reading or noticing the input instructions, causing usability issues especially for those with reduced vision.
How to Fix
Increase the text color darkness or add a subtle background behind the text to boost contrast to at least 4.5:1.
Issue Highlights
Unlabeled text input area with placeholder example
Major
Content Readability & Clarity
The Problem
The large input area uses an example sentence as placeholder text but lacks an explicit label or descriptive heading to clarify its purpose.
Why it Matters
Users may not immediately understand what input is expected or the function of the field, leading to hesitation or input errors.
How to Fix
Add a clear label above or inside the input area explaining what the user should do, e.g., 'Enter your task description' or 'Ask your AI assistant'.
Issue Highlights
Unclear primary action after text input
Major
Flow & States Completeness
The Problem
The main input area includes a text box and an arrow button, but it is not clear what the arrow button does or what the immediate next step is after entering text. There is also a plus button with unknown functionality.
Why it Matters
Users may be confused about how to proceed after entering their text, causing hesitation or abandonment.
How to Fix
Add clear labeling or tooltip to the arrow and plus buttons explaining their functions and ensure the primary action is visually distinct and clearly indicated.
Issue Highlights
Lack of instruction or placeholder guidance for projects section
Major
Flow & States Completeness
The Problem
The 'My projects' section displays project cards but does not show any message or guidance for when there are no projects present or how to create a new project.
Why it Matters
New users or users with no projects may not understand what to do next or how to get started, causing frustration or drop-off.
How to Fix
Add a clear empty state message with steps or buttons to create new projects when none exist.
Issue Highlights
Unclear affordance for input and agent selection buttons
Major
Strategic Design
The Problem
The input text area and the selection buttons below it (labeled with different 'agents') may be confusing because the buttons look more like tags than interactive choices. The '+' icon is also ambiguous regarding whether it adds a new agent or additional text.
Why it Matters
Users may not know how to start or change the type of task they want the AI assistant to perform, creating friction at the initial interaction point.
How to Fix
Redesign the buttons to look like clear selectable tabs or radio buttons with distinct hover and selection states; clarify the '+' button's purpose with a tooltip or label.
Issue Highlights
Weak hierarchy in main headline with mixed bold and gradient color
Moderate
Content Readability & Clarity
The Problem
The main headline mixes strong black text with a gradient color phrase '이제 AI 비서로' without clear typographic distinction beyond color, which may cause confusion about what to focus on first.
Why it Matters
Users might struggle to quickly grasp the key message or the relationship between parts of the headline, affecting comprehension speed.
How to Fix
Use consistent font weight hierarchies and spacing combined with accent colors to separate emphasis clearly, ensuring the gradient text does not compete with bold black text.
Issue Highlights
Inconsistent Button Styles in Agent Selection
Moderate
Visual Consistency, Imagery & Media
The Problem
The agent selection buttons below the input box use mixed styles: one button is gradient purple with white text, while others are light gray with dark text, lacking visual consistency across the set.
Why it Matters
Inconsistent button styling can confuse users about which option is selected or interactive, reducing clarity and ease of use.
How to Fix
Use a consistent button style with a clear active state indicator. For example, keep all buttons the same shape and size, with the active one distinctly styled with color and the inactive ones in a consistent muted style.
Issue Highlights
Missing clear page or section orientation indicator
Moderate
Orientation Missing (Environment/Role/Location)
The Problem
The interface does not visually indicate the current page or section clearly. The side navigation uses icons and labels, but there is no prominent active state or contextual breadcrumb to communicate the user's current position within the app.
Why it Matters
Without clear orientation cues, users may become confused about their location in the app, reducing ease of navigation and increasing frustration.
How to Fix
Add a distinct active state or highlight on the current navigation item and include breadcrumbs or a header that explicitly indicates the current section or page.
Issue Highlights
Plus button tap target too small
Moderate
Accessibility & Input Ergonomics
The Problem
The plus (+) button on the left side inside the input box appears very small, likely smaller than the recommended minimum target size of 44x44 pixels.
Why it Matters
Small tap targets can cause difficulty in pressing accurately, leading to user frustration and input errors.
How to Fix
Increase the size of the plus button to meet the recommended minimum tap target size, and add sufficient padding around the icon.
Issue Highlights
Send button tap target too small
Moderate
Accessibility & Input Ergonomics
The Problem
The send (arrow) button on the right side inside the input box is small and may be below the recommended minimum touch size.
Why it Matters
Small tap targets can increase the difficulty of tapping and cause accidental misses.
How to Fix
Enlarge the button's clickable area with extra padding to meet accessibility guidelines for touch targets.
Issue Highlights
Misaligned Navigation Icons and Labels
Moderate
Visual Consistency, Imagery & Media
The Problem
The vertical navigation icons and their labels on the left sidebar appear to have inconsistent vertical spacing and alignment, causing a disjointed visual flow.
Why it Matters
Misaligned navigation elements reduce perceived polish and can make the interface feel cluttered or poorly designed, impacting user trust and ease of navigation.
How to Fix
Align icons and labels consistently with equal vertical spacing and baseline alignment using a grid system.
Issue Highlights
Unlabeled Plus Icon in Text Input Area
Moderate
Visual Consistency, Imagery & Media
The Problem
The plus icon button located inside the text input box has no visible label or tooltip to clarify its function.
Why it Matters
Users may be unsure what action the plus icon triggers, leading to hesitation or errors during interaction.
How to Fix
Add a descriptive tooltip or label to the plus button to clearly communicate its purpose, for example 'Add new item' or 'Expand options'.
Issue Highlights
Crowded sidebar navigation with small clickable areas
Moderate
Navigation & Structure
The Problem
The left sidebar contains multiple navigation items placed closely vertically with small icons and text labels that may be hard to distinguish or accurately tap/click, especially on smaller screens.
Why it Matters
Dense click targets make it harder for users to quickly find and select the desired navigation option, increasing cognitive load and input errors.
How to Fix
Increase spacing between sidebar navigation items and consider grouping related items or collapsing less frequently used options to reduce density.
Issue Highlights
Too many agent types to choose from upfront
Moderate
Efficiency & Cognitive Load
The Problem
Users must choose from four agent types displayed as buttons below the input field, increasing initial choice complexity.
Why it Matters
Having multiple agent options presented at once can overwhelm users and slow down their decision-making.
How to Fix
Consider streamlining agent options or presenting them progressively based on user input.
Issue Highlights
Lack of clear visual hierarchy between text and action area
Moderate
Strategic Design
The Problem
The main headline text and the interactive input box below share somewhat similar visual weight with a soft gradient background, which may cause dilution of focus for users when first viewing the screen.
Why it Matters
Users may have difficulty quickly understanding the primary call to action or their next step, slowing down their initial engagement and reducing conversion potential.
How to Fix
Increase contrast and size difference between the headline and input area, and introduce stronger visual cues or spacing to separate them distinctly.
Issue Highlights
Unclear interaction with agent filter tabs
Moderate
Flow & States Completeness
The Problem
The category tabs below the text box show different agent types but it is unclear how selecting these tabs alters the content or what the next step is after selection.
Why it Matters
Users may not understand how to use these tabs or what happens after selecting one, leading to confusion or incomplete flow.
How to Fix
Provide a visual or textual cue indicating what changes when a tab is selected and what users should do next, such as a call to action or preview update.
Issue Highlights
Poor visual hierarchy in category tags below input box
Minor
Content Readability & Clarity
The Problem
Category tags under the input box are presented in similar font size and weight with subtle background differences, making it hard to discern their grouping or current selection apart from a gradient highlight on one tag.
Why it Matters
Users may find it difficult to distinguish selected categories and understand the organization of options quickly.
How to Fix
Increase contrast between selected and unselected tags and use clear size, weight, or spacing differences to indicate hierarchy and selection state distinctly.
Issue Highlights
Small caption text below headline
Minor
Content Readability & Clarity
The Problem
The caption text below the main headline is quite small and light in weight, which could impair readability especially for users with visual impairments.
Why it Matters
Users may miss important descriptive or contextual information that supports the headline.
How to Fix
Increase font size slightly and use a darker color or heavier weight to enhance legibility.
Issue Highlights
Multiple project category filters add minor extra decisions
Minor
Efficiency & Cognitive Load
The Problem
Several category filters like '추천', '업무 자동화', '이메일', etc., require users to decide which to activate, adding small additional steps.
Why it Matters
Each additional filter selection is a separate micro-decision that can add to user cognitive load if not critical.
How to Fix
Minimize category filters or group them to reduce upfront selections required.
Issue Highlights