There are many social network portfolios out there—LinkedIn, Behance, GitHub—but they all treat the portfolio as an afterthought. These platforms have become cluttered and it is easy to get lost in all the other functionality. We wanted to focus on what matters: the projects. That is why we set up Showfolio, with care put into every UX decision.

What it does

Showfolio is focused on content first. Every project listed on the website follows the Problem → Solution → Implementation → Outcome model, which ensures that users consistently share their approach and thought process behind their work, not just the final result.

Each user has their own personal page that lists all of the work they've chosen to share, including a featured project. It's branded to look like it could be your own personal website, yet it remains professional.

The product is targeted at students who are looking to do project work—in programming, design, business, or anything. They can share their profile URL with friends and future employers.

How we built it

We first decided on what tools we wanted to learn for the project. We settled on TypeScript and React as frameworks we wanted to improve. After we knew we were doing a web app, we went to work on the design. We spent the first few hours chatting, relaxed as we started the hackathon a few hours late. The first day was mainly UX and design - thinking how every decision would influence the user of our platform. The second day lasted nearly 24 hours, as it was now crunch time. This is when the back end was forged using ts-Node (Node.js with TypeScript) and the css was stylized (using modular sass).

Challenges we ran into

Work is never done, and knowing the scope of a project is essential. We had a bit of scope creep as we weren't originally planning on doing a backend. However, with the amount of dynamic content - full paragraphs and images - it didn't make sense to stay with a static site. Fortunately, the backend for this website only took a couple hours. The choice was made to hold all data in system files instead of a structural database. This saved a lot of time that could have been spent setting up tables. However, we still ran into some annoyances connecting the frontend to the backend that costed us some time.

In addition, design has no right answer. We weren't 100% confident about a couple of design choices, such as how to scale from desktop to mobile for the projects page, but with time against you eventually one has to make a decision.

Accomplishments that we're proud of

For 36 hours, it's functional and looks great.

What we learned

Start small. Build out an MVP. It'll take much longer than anticipated. But once you've got something stable and clean-looking, that's when the fun begins.

What's next for Showfolio

This project started as a hackathon idea but we can see it becoming a popular portfolio site for students (or at least ourselves).

Share this project: