Refreshing Sidebar for 2020
It’s been three years almost to the day since I last redesigned Sidebar. But after many iterations, I was able to finally design and code a fresh new Sidebar!
A Look Back
But first, to celebrate this fourth version I want to take a look back at how Sidebar’s design has evolved since its start all the way back in 2012:
Version 1: The Actual Sidebar
Version one was pretty minimalistic. After all Sidebar’s name itself is a reference to blog sidebars which traditionally contained links to other interesting resources (or a “blogroll” as it was known in the Olden Times), so the design was a reference to that idea.
Version 2: The Launch Screen
Sidebar 2 was a lot less minimalistic. Instead of being inspired by actual sidebars, it was inspired by “new tab” launch screens like Momentum, complete with big images.
Version 3: The Feed
Version 3 evolved in the direction of social media feeds: a long page you could scroll, primarily typography-based, but with just enough visual flourish to keep things interesting.
Version 4: The Grid
Which brings us to this latest version.
As you can see, thumbnails are gone. This is as much for aesthetic reasons (most articles don’t actually have a corresponding nice-looking thumbnail I can feature) as cost-saving reasons (image hosting is expensive!).
The decision to remove images informed a lot of the design, since I didn’t want to end up with a boring text-only page.
This translated into two things: first, giving typography a big role to play via the date markers; and second, the idea to alternate the layout to vary the page’s rhythm.
The result is a magazine-like layout (using CSS Grid) that provides a lot of flexibility while keeping things interesting — and hopefully being distinctive enough that people actually remember the site if they come across it.
I also wanted to have special areas below each dates to promote things like the newsletter, job board, or other special features I might come up with in the future.
Besides the cosmetic improvements I also have a couple new features planned, the first of which is a leaderboard which shows you a ranking of top Sidebar contributors, as well as the most popular domains linked on Sidebar.
Who knows, you might discover new people or resources to follow!
There’s also subtle tweaks, like the fact that the credited avatar next to a submission is not the avatar of the person who submitted the link anymore (which is usually me) but the avatar of the owner of the linked site.
Technical Stuff
Ever since version 1, Sidebar has been powered by my own homegrown framework, Vulcan.js (or Telescope as it used to be known). This is a JavaScript framework that bucks the current Jamstack trend by being an all-in-one, full-stack monolith. In other words the same app that powers the Sidebar API also serves its pages.
This approach is not without its downsides (it can’t really match the speed and robustness of purely static content) but it does let you move much, much faster in terms of development speed since you only have to worry about a single codebase.
Sidebar may seem like a simple project, but if you think about everything going on in the back-end in terms of moderating submissions, generating newsletters, and browsing archives, it’s actually a fairly complex project for a single developer working on it in their spare time!
I do hope to add a static front-end powered by Next.js in front of the Sidebar API at some point in the future, but for now Vulcan.js is doing a great job by itself!
I’m especially happy with the new admin dashboards (to help manage submissions, categories, newsletters, etc.). They were very easy to build since they make use of Vulcan’s built-in Datatable component that gives you search, filtering, pagination, etc. out of the box.
I am hoping to write more about Sidebar’s code (and even open-source it) soon, so stay tuned (or drop by the Vulcan Slack to say hello) if you’re interested.
The Best Design Links Every *Week*day
After nearly eight years of sending out Sidebar every single day of the week, I’ve decided to switch to a five-days-a-week schedule: there will be no more Sidebars on the week-end!
The reason is simple: most people take the week-ends off (as they should!) so there is far less content produced on these days, which in turn makes finding five interesting links much, much harder!
I’ve also heard from many people over the years who have had trouble keeping up with five links every single day. So this is a way to lighten the load a little bit and go from 35 to 25 links a week. And hey, Sidebar is all about the number five anyway so it’s on-brand!
Going Forward
I have to say that working on this new version has rekindled my motivation for improving and developing Sidebar. If I’m honest, I haven’t always had the time or energy to put in the work over the last few years, which probably explains why Sidebar’s audience hasn’t really grown.
But I want to change that, and start exploring new ideas. Maybe I could feature members of the community, similar to what Dribbble does. Or how about a Sidebar podcast? Or should Sidebar have more of a social aspect with commenting and upvoting, like Designer News does?
I have a few ideas but I’m also excited to hear yours! So leave me a comment here to let me know what you’d do if you were in charge of Sidebar.
In any case, for now I’m happy enough with this new version. And here’s to seven more years of five design links almost every single day!
