Frontend Dev Challenge: Week 11
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
Without changing anything in the HTML, style this article on happiness.
The Submissions
This week we had some guest submissions from two members of the excellent Operations team at Fueled!
Christine Chung
My goal was to create something clean and simple, yet dynamic with slight accents that would make the design a bit more fun. My favorite feature is the color transition/animation I added to the comment box. In general, I played around with different fonts and background colors and tried to find a scheme that didn’t distract from the content. I had trouble in the end with formatting and aligning the comment box, and ran out of time before I could fix it. I also had to hide the bullets/listing feature because I couldn’t figure out how to align it to the center without ruining the entire comment box. It was challenging to create something more complex without being able to modify and add to the html.
As a non-technical team member at Fueled, I was so grateful to be given a chance to be a part of this challenge and interact with the web team. This opportunity gave me a better understanding of the technical scope and challenges that our web engineers face on a daily basis. With this experience, I am more confident in vetting our technical candidates during the hiring process!
See the Pen by Christine Chung (@cchung) on CodePen.
Keaton Kruser
While I have little (to no) experience with frontend development, I found this to be an incredibly fun challenge! Knowing my own limitations, I opted to lean in and try to capture the essence of the web designs of yesteryear. The real pièce de résistance of my design is the curved photo caption text— something I assumed would be a simple task ended up requiring the most technical prowess and eating up most of my time, though in implementing I did learn how to import a JavaScript library (shout out to Joe for walking me through it). Given a bit more time, I would’ve worked on styling the comment section and submission boxes, but when it came down to the wire I had to simply hide them away from the world.
Huge thanks to the web team for letting me participate in this challenge! I had a blast a really learned a lot. Happy Pride Month! 🏳️🌈
See the Pen by Keaton Kruser (@keaton-kruser) on CodePen.
Rob Sterlini
See the Pen by Rob Sterlini (@robsterlini)
on CodePen.
Joe Richardson
See the Pen by Joe (@dope)
on CodePen.
Harriet McMahon
See the Pen by Harriet McMahon (@harrietmcmahon) 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.
