Devfolio's Project Submission

Devfolio’s Project Submission is one of the core features of the platform. Up till now, a total of 75K+ projects have been submitted. Monthly, 1000+ projects are added by users who participate in hackathons or adds a side project.

This can happen in two ways, either you are a part of ongoing hackathon who’s submissions are open or you might be adding a side project on Devfolio.

A user starts by adding a name for their project. This is done separately so a draft submission can be created with a project name and is easier for the user to pick it off where they left.

This is how the project submission page looks, where users can start adding things related to their project. Users loose the option of applying to hackathon tracks if they are submitting a side project (not a part of hackathon)

You may notice that it looks very similar to the Project Page, this was done intentionally so that users have a clearer picture of what they are submitting and how the end product is going to look like.

Here’s how the older version of Project Submission looks like. It was the most simplistic thing designed for speed.

Few issues we faced with this: This project submission does not give any idea of how the final submission page will look like. Since the hackathon projects would be seen by a large number of people including the judges and the partners, it was essential that their project submission is in the best shape, with high quality images, demo video, links etc.

We saw people constantly moving back and forth their project submission and project page.

We designed the new project submission to look as close to the final project page.

One potential downside was, it may look too identical to the final submission that the users forget to submit their project, so we added this banner on the top.

Here’s how a user applies to tracks their project fits in. There are two kinds, one by the Hackathon and the other by the Partners.

A user can add the track they are applying to. We added a button to switch between hackathon tracks and partner tracks to aid in the discovery.

Hackers decide what tracks to build on at the beginning of the hackathon from the prizes page so a search is also crucial to get to exactly what they need.

A track is applied to, users can choose to edit, delete or apply to a new track.

The added friction of applying to a track is intentional to discourage bounty farming. Different hackathons have different rules for how many tracks a user can apply to.

And this is how a user can add project links.

Error handling for different states

Here’s how a project looks like when it is under drafts for a hackathon on the user’s dashboard.

Here’s how a project looks like when it is submitted.

For the mobile screens, we kept things simple and functional, about 5% of the hackers in a hackathon resort to submitting on a mobile if they are facing issues on their desktop / laptop.

Here’s how the public page for the project looks like after submission