Quicks: Daily Doodle Challenge

• 

  Doodle creation

• 

  Post

Inspiration

We were inspired by the power of quick, creative exercises to boost productivity and mental agility. We wanted to create a fun, engaging way for people to take short breaks and flex their creative muscles.

What it does

Quickss presents users with a daily doodle challenge. Each day, users get a random prompt and 60 seconds to create a doodle based on that prompt. The app provides a simple drawing interface with various colors, brush sizes, and tools like eraser and undo. After completing the challenge, users can share their doodles and provide feedback on their experience.

How we built it

We built Quickss using React and TypeScript. The core components are: • QuicksComposerComponent: Handles the drawing interface and timer. • QuicksFeedComponent: Displays completed doodles and collects user feedback.

We used HTML5 Canvas for the drawing functionality and implemented custom state management for features like undo and color selection.

Challenges we ran into

• Implementing a smooth drawing experience with varying brush sizes and an eraser tool. • Balancing the time pressure of the challenge with user-friendly features.

Accomplishments that we're proud of

• Creating an intuitive, responsive drawing interface. • Implementing a fun, engaging daily challenge system. • Designing a visually appealing UI that encourages creativity.

What we learned

• Advanced canvas manipulation techniques in React. • Balancing feature richness with simplicity in UI/UX design. • The importance of immediate feedback in engaging user experiences.

What's next for Quicks: Daily Doodle Challenge

• Implementing a gallery feature to showcase daily top doodles. • Adding social sharing capabilities. • Enhnace the UIUX of Quicks miniapp more by user feedback

Built With

• typescript