Every two weeks the Frontend Team at Fueled partake in a development challenge: a loose brief is given to the team on a Friday (with the briefs being decided by any of the team with a suitable idea), between Monday and Wednesday we build our solutions, and then on our weekly team call we each present our submission providing rationale and opening up a discussion – typically people talk about the bits they enjoyed, found tricky, and areas they’d have further elaborated on if they’d had the time.

The Brief

Create a loader for an action of your choice, the snazzier the better!

The Submissions

Timo Jedai

“I went for an abstract shape looping through an infinite css animation. I played with different angle rotations between the parent, child blocks and then displayed it behind the loading text to give it more depth and perspective.”
See Timo’s bio

View Timo’s submission

Harriet McMahon

“I wanted to create a loader that I could also use on my blog. The idea is to be able to pass a prop each time someone loads a new article, that way the loader displays emojis linked to the theme of that post.”
See Harriet’s bio

See the Pen
Loading State by Harriet McMahon (@harrietmcmahon)
on CodePen.

Joe Richardson

“I'm a huge fan of the Nintendo Switch, they have a fun little loader when you open up the eShop - I wanted to try and re-create it for this challenge but it was tough to nail down in 2 hours, there is a lot of custom easing behind it which I just couldn't figure out in 2 hours. However I still had fun and I'm pretty happy with it.”
See Joe’s bio

See the Pen
Nintendo Shop by Joe (@dope)
on CodePen.

Rob Sterlini

“I wanted to create a loader that you might use for the initial load of a website, so – not worrying too much about scale – I sketched out some lettering for the word loading and created the draw animation using a `stroke-dasharray` CSS technique; and then played around with the colours to give it a more dynamic feel.”
See Rob’s bio

See the Pen
KEadex by Rob Sterlini (@robsterlini)
on CodePen.

Next time…

This is a fortnightly endeavour, so stay tuned!

You can relive past challenges and get updates each time a new set of submissions is added by watching or starring the GitHub repo.