Categories
Uncategorized Web Dev

New website and logo showcase: A brand new brand

Yesterday, the newest CodeBuffet website has been put online! The entire website, this blog and logo has been changed. There are a number of nice little technological achievements in the new website, and I’d like to share those with the world!

5 years of CodeBuffet

The new website

The main differences between the new and the old version, is that the new version is completely home-made. The previous version was just a custom WordPress theme.

1 big slide show

The first thing you’ll notice when you go to codebuffet.co, is that you can slide back and forth into different slides while being on the homepage. On some slides, you can scroll down to read more about the specific slide (i.e scrolling down the homepage slide will give you an intro to the company)

I have had this kind of design in my mind since 4 years, but it was only now that I had the feeling that I had implemented in the most practical way. I see this kind of design as quite risky. I wanted to try it nonetheless.

The colors of the page adjusts to that of the content

One of the reasons I wanted a ‘big slideshow’ was to make the portfolio come to life in the best way possible. One of the things that occurred to me when you have such a big space reserved for your portfolio, you basically have 99% content and a 1% frame.

So instead of adjusting the content to fit the page, I decided to adjust the page to fit the content.

2 different slides makes the side adjust it’s color.

There is something very interesting in the way this works: The logo on the bottom-center is not an image, it’s a font. The reason for this is because you can’t instantly change the color of an image in html/css/js without using a canvas or pre-processed (colored) versions of an image (source). Using a canvas with color transitions would be a disaster regarding performance. With a font, I can change and transition the ‘text color’ back and forth to whatever I want, without having performance penalties, even on mobile.

Logo changing colors

Conclusion

Overall, there are some very neat developments being done on this website, it’s by no doubt become a creative outlet for my company’s web development efforts. It’s been up just one day (at this time of writing). I hope you like it, any feedback is welcome 🙂

Leave a Reply

Your email address will not be published. Required fields are marked *