Super Blog Brothers
Super Blog Brothers was a fun build, I met Andy and George through a friend of mine, and we hit it off due to our love of games. They told me about their plan to start a video game blog and the conversation flowed on to a site I could build for them.
The brief they gave me was largely open, having been through a Bachelor of Comms design they trusted me with the look and feel. I talked them into some 3d assets (using Threlte JS) to help them with personlisation and they loved that, bringing this feel of game assets to a website about games. I got to build the site using my favourite framework SvelteKit, so the DX was really nice for me. I opted for a CMS, Prismic, so that Andy and George could take control of the content side and add/remove posts as they wanted.
Tech Stack
- ○SvelteKit
- ○Threelte JS
- ○Prismic
- ○Typescript
- ○GSAP
- ○Tailwind
Purpose and Goals
My endgame for the Super Blog Brothers was to create a nice modern looking website that had a sense of fun about it. I wanted to replicate the kind of interest and wonder you get from playing a great video game, so I naturally was drawn towards animations and 3d.
The site also needed to be easily updated and editable, so that the Brothers could add/update/delete their blog posts at will. For this I needed a CMS, and I've had some small experience with Prismic, so I went with this. I remember there being a bit of a learning curve with the old Prismic, but given the Brothers would just be using it as a content creation for blog posts, and their background in games development, I didn't think it too much of an issue.
These blocks give a fun sense of play to the splash screen and are interactive. Check them out here, or check out the code here
The blog list page has a fun hover effect on the images, showing a preview of the cover art of the game being reviewed. Check them out here, or check out the code here
I wanted the topics that Andy and George write about to be a little more interesting than just a static list, so I added a scoll animation. Check it out here, or check out the code here
Challenges and Lessons Learned
The biggest challenge for me came to me towards the end, and that's having a solid outline from the start. I think with a project with such an open brief it's nice to have a little wiggle room, but without structure and planning it can blow out the timeline as I get carried away with trying out all the cool things I can do. There's also a lesson that goes hand in hand with this kind of issue and that's not to let the perfect be the enemy of the good. I found myself losing time trying to optimise everything, or make things pixel perfect when it really wasn't necessary to do so.
