Freelance Board

Freelancers need a fast, clear overview of their projects. General-purpose tools like Notion can become cluttered when used for this single purpose.
This project was built within a 2-week timebox, so I focused on an MVP. Features that were out of scope are listed under Future Updates.

Build a focused dashboard that minimizes distractions and highlights only the most relevant project information.

I built a minimalist Kanban board with clear status columns, project create/update flows, and quick filtering. The product is designed for daily use: fast entry creation and low interaction friction.

Key decisions:

1. Keep interaction model simple and predictable for daily usage.
2. Support both demo access (fast evaluation) and authenticated CRUD (real data flow).

Available features:

• Status filter bar to toggle visible columns
• Card field sidebar to toggle visible fields on cards
• Create cards
• Edit cards in a modal (direct in-board editing is planned for v2)

Outcome: The board enables faster project tracking and easier prioritization.

I chose a layered architecture with UI, validation, domain, repository, and database layers. This structure improves maintainability and makes feature extensions easier.

Key decision

• Gateway implementation - provides a single interface for data access while hiding the active data source (Local Storage in demo mode, Supabase for authenticated users).

1) Column overflow vs. board usability

Problem: With a growing number of cards, columns exceeded the viewport height and lower cards became hard to reach.

Options:
1. Keep global page scrolling as the only way to access lower cards.
2. Add independent vertical scrolling inside each column.

Decision: I chose Option 1 (global page scrolling).

Why not Option 2: Nested scroll behavior (horizontal board + vertical column scroll) created UX friction and reduced navigation clarity.

Trade-off: The page can become long.
Mitigation: Card status remains visible on each card, so task state stays understandable even when headers are out of view.

2) Fast recruiter testing vs. protected CRUD

Problem: Full CRUD requires authentication, which increases friction for recruiters who want to test quickly.

Options:
1. Make database access public.
2. Provide a demo mode with Local Storage as the data source.

Decision: I implemented a gateway approach that separates authenticated DB access from demo access.

Why: This keeps production data protected while still allowing instant hands-on testing.

Trade-off: Demo mode does not fully prove the production repository flow by default.
Mitigation: I added a fast magic-link sign-up so interested reviewers can test the real DB flow with only a few extra clicks.

The board is live and fully functional. You can create projects, update their status, and filter by priority in seconds.

• Keep interactions simple: Nested scrolling (page + column scroll) creates friction on Kanban boards. A single, predictable scroll direction is much clearer to use.
• Layered architecture helps with changes: Separating UI, domain logic, and data access made refactoring easier and reduced unexpected side effects when updating features.

• Drag & Drop: drag and drop cards through the columns
• Sorting Cards: Sort the cards in a column by a given field. Accessed through the sidebar
• Direct edit on board: Edit the card fields by clicking on the on the board without modal