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.
Create a loader for an action of your choice, the snazzier the better!
“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
“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
“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
“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
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.