Focus Mode

• 

  Working mode

• 

  second image

• 

  choice image on background

Inspiration

Whenever you try and focus, there are often a lot of distractions and there is a lack of a quiet space. We thought that we could try and solve this problem by creating a web app which allows you to concentrate for as long as you need, with relaxing backgrounds and music.

What it does

Focus Mode allows you to create an account and save add custom backgrounds to the app. You can then go into focus mode which is a full-screen version. If you would like music to help you focus, there is a lofi playlist available too!

How I built it

In the team, we split the tasks into back-end and front-end functionality. This made our tasks very different.

Challenges I ran into

• Creating MongoDB architecture to allow users to have their own images.
• Adding music and animations to front-end of project
• Using Express to make the application available for up to 1000 users

Accomplishments that I'm proud of

Completing the initial project in 24 hours - we didn't think it seemed possible to finish the project in 24 hours when we first started, but gradually it all came together.

What I learned

It may be better to not completely separate the tasks in a project - perhaps having a mixture would be more interesting and the final product would be more creative.

What's next for Focus Mode

We hope to continue working on Focus Mode by making the design nicer and adding more default backgrounds as well as a settings feature where you can add a countdown timer and other features.

Built With

• css3
• ejs
• html5
• javascript
• mongodb
• node.js