Skip to main content

Funnelbox: a design agency website to emulate

Words: Jenn Lukas (opens in new tab)

Award-winning, Oregon-based design production studio Funnelbox (opens in new tab) has a snazzy new site, and it's a masterclass in how to present video in an engaging and effective manner.

The website employs prominent large imagery and a dark, sophisticated colour scheme that's wonderfully easy on the eye. On top of all that, the rather beautiful opening slide show comes with some neat CSS effects when hovering over the image.

Hover over the opening slideshow and you'll some subtle but neat visual effects

Hover over the opening slideshow and you'll some subtle but neat visual effects

CSS effects

Using additional divs as masks, hovering transitions the opacity and width of these divs to produce a very usable interface and a nifty effect to boot.

"Motion was used to enhance the experience where appropriate, but it wasn’t overused," discloses developer Neal Mckinney. As you delve deeper into the site, you will find these animations and transforms scattered throughout it in appropriate locations; one example is on the
Our Work page.

The agency puts as much effort into blogging about others' work as it does its own

The agency puts as much effort into blogging about others' work as it does its own

Circular shapes

Elsewhere on this same page, you’ll see CSS used to create the circular shapes of some links. "I try to keep my CSS as simple as possible for browser compatibility," Mckinney adds enthusiastically, "so for the circle-cropped images I simply applied a large border-radius, and used CSS3 PIE for older versions of IE."

animations and transforms scattered throughout the site in appropriate locations

animations and transforms scattered throughout the site in appropriate locations

This showcase was originally published in .net magazine (opens in new tab) issue 233.

Now read these!

Thank you for reading 5 articles this month* Join now for unlimited access

Enjoy your first month for just £1 / $1 / €1

*Read 5 free articles per month without a subscription

Join now for unlimited access

Try first month for just £1 / $1 / €1

The Creative Bloq team is made up of a group of design fans, and has changed and evolved since Creative Bloq began back in 2012. The current website team consists of six full-time members of staff: Editor Kerrie Hughes, Deputy Editor Rosie Hilder, Deals Editor Beren Neale, Senior News Editor Daniel Piper, Digital Arts and Design Editor Ian Dean, and Staff Writer Amelia Bamsey, as well as a roster of freelancers from around the world. The 3D World and ImagineFX magazine teams also pitch in, ensuring that content from 3D World and ImagineFX is represented on Creative Bloq. 

Topics