Oluwadamilare
← All projects
Interactive AppsPrototype

Personality Checklist App: A Lightweight Interactive Self-Reflection Tool

A responsive checklist app that guides users through structured self-reflection and returns clear, approachable summaries.

Frontend/product prototype builder · 2024

  • Next.js
  • TypeScript
  • Tailwind CSS
Role
Frontend/product prototype builder
Status
Prototype
Year
2024
Type
Interactive Apps
Access
Public

Overview

The Personality Checklist App is a lightweight, interactive tool for structured self-reflection. It guides users through a checklist and reflects results back in a clear, approachable summary — framed as self-reflection, not clinical assessment.

Problem

Self-reflection tools are often clunky, and the experience matters as much as the questions. The aim was a smooth, responsive flow that feels approachable and presents results clearly, without overclaiming what a checklist can tell you.

Interaction flow

  1. Start with a clear, low-pressure intro
  2. Move through the checklist one step at a time
  3. Track progress and selections as state
  4. Return a clear, approachable summary

Technical approach

Built with Next.js, TypeScript, and Tailwind, with attention to clean state handling for the checklist flow.

  • Component-driven UI
  • Explicit state for selections and progress
  • Result presentation derived from the inputs

Accessibility considerations

  • Semantic, keyboard-navigable markup
  • Visible focus states
  • Readable contrast and a responsive layout
  • Labels and structure assistive tech can follow

Limitations

  • For self-reflection and self-awareness, not clinical or psychological assessment
  • No claim of psychological validity
  • Results are a mirror, not a diagnosis

What it demonstrates

  • Interactive UX and clear state handling
  • Responsive, accessible frontend work
  • Turning inputs into a clear result presentation
  • Product-minded framing of a sensitive-ish tool

Stack

  • Next.js
  • TypeScript
  • Tailwind CSS

Proof assets

Some proof assets use dummy data or are shared as private walkthroughs to protect sensitive systems and records.

  • DemoComing soon

    Live demo

    Try the checklist flow.

    Coming soon

  • ScreenshotsPlanned

    Screenshots

    Key screens of the flow.

    Planned — to be added

  • GitHubComing soon

    GitHub

    Source repository.

    Coming soon

Availability

PublicCode and a demo can be shared freely.

Next steps

  • Add shareable result summaries
  • Add screenshots and a live demo
  • Refine the result presentation