TaskFlow Authentication Flow

This project presents an accessible authentication flow designed for a SaaS platform called TaskFlow.

The interface was designed with WCAG 2.1 accessibility principles in mind, including clear focus indicators, accessible color contrast, and error feedback that does not rely on color alone.

The solution includes responsive authentication flows for both desktop and mobile devices, along with reusable components and validation states.

Accessibility Considerations

• WCAG 2.1 AA color contrast

• Visible focus indicators for keyboard navigation

• Error feedback using color, icons, and text

• Clear form labels and validation guidance

• Touch-friendly interaction targets on mobile

Figma project:

https://figma.com/TaskflowPres

Interactive prototype:

https://figma.com/TaskflowProto

If you don't have time to open the project, here's some quick walkthrough. Enjoy!