FocusPal

Inspiration

FocusPal was inspired by the everyday struggles of students juggling classes, assignments, exams, and motivation. We wanted to create a single dashboard that makes planning, tracking, and achieving easier and more visually rewarding.

What it does

FocusPal brings together:

• Weekly task planning
  
• Daily to-do list
  
• Exam countdowns
  
• Motivational boosts
  
• Focus session timers
  
• Progress tracking
  

All beautifully organized in one interactive platform to help students stay on top of their academic game.

How we built it

We built FocusPal using a React + Tailwind CSS + Shadcn UI stack.

• Used local storage for saving tasks and progress.
  
• Integrated lucide-react icons for a clean and modern look.
  
• Designed with reusable components for tasks, motivation, and focus tools.
  
• Built with a fully responsive layout for both desktop and mobile users.

Challenges we ran into

• Synchronizing state across dashboard widgets without bugs.
  
• Ensuring smooth performance during real-time task updates.
  
• Designing an intuitive and appealing UI across screen sizes.

Accomplishments that we're proud of

• Integrating multiple productivity features in a clean, distraction-free interface.
  
• Creating a pleasant user experience with subtle animations and responsive components.
  
• Delivering a student-friendly tool that genuinely improves planning and focus.

What we learned

• How thoughtful UX touches (like transitions and feedback) increase user engagement.
  
• Hands-on experience with React hooks and local storage.
  
• Advanced layout/styling using Tailwind CSS and component-based design with Shadcn.

What's next for FocusPal

• Add Supabase integration for cloud sync
  
• Introduce personalized motivational content and habit streak tracking
  
• Enable calendar sync with Google/Outlook
  
• Let users share plans with study buddies and mentors

Built With

• chatgpt
• lovable
• react
• tailwindcss