Expanding my Skillset with Webflow

Expanding your skillset not only keeps you relevant in terms of what you can offer your employer, but it also keeps you passionate and excited about turning up to work every day.

Al Power 👨‍🎨

--

For me, I’ve always seen myself as more of a creative designer. The visual side of design has always been at the forefront of my career, and I’ve always pushed to try expand that expertise. All through my career I’ve pushed myself to learn new programs or techiniques to help allow myself express myself. From designing concept iPhone apps in Photoshop, through to illustrating kids books in Procreate, I’ve always wanted to try learn as much as I can as it gives more opportunities to move forward.

I’ll give you a quick timeline of my career. I’ve gone from a Web Designer (2003–2007), to a UI Designer (2007–2014) to a Product Designer(2014–2020) to a Brand Designer (2020-present). It’s all about progression. I don’t see myself as a Brand Designer because that’s my current role. I‘m trying to round myself in as many areas of design as possible. I feel each step has fed into the next, and as I learn, I grow. That is probably the most pretentious thing I’ve ever written, sorry… 🤮

My latest challenge has been to jump knee deep into learning Webflow, and it’s been a game changer for me. As a designer I’ve always felt limited. Limited in a sense that once you’ve created a design, you need to get another person, aka a web developer, on board to make your creation a reality, for people to actually see and use it. I’ve worked with some amazing developers in my time, literally outputting pixel perfect builds of my work, but building your own design just gives you that next level of control. It allows you to carry your design one step further, it allows you to have control until the very end of the process.

We originally started using Webflow in Shortcut (where I’m currently Lead Brand Designer) as a way for the design team to build out side projects. As part of a Hackathon, I worked closely with Paolo D'Ettorre, to build out our Designer Site in Webflow. At the time our main marketing site was built using Prismic, and required 2 full time web developers to manage and build each individual page. It was pretty time consuming. Then, through Webflow, I watched Paolo build out a fully working website in days! Something didn’t add up. Was Paolo a witch? Maybe. Was Paolo paying someone on Fiverr to build the site at night on the sly? Possibly. Either way I wanted to learn Webflow. I felt it could be an extremely powerful tool for our team moving forward. I love the opportunity to push ideas and with Webflow it would give us an extra tool to express ourselves. Win/Win!

After the design site was built out, we quickly built a similar site for the Engineering team. A place for our teams to sing about their values, share their playlists and generally just say hello! These micro sites worked great, and from there, the Content team decided that we were going to build out our whole Training Hub using Webflow. The only problem was Paolo had recently left the company, and I was the only one who had any knowledge of Webflow, so I faked it and told them I knew exactly how to do it. I jumped in at the deep end and took on the project, even though I had no idea what I was doing! This project taught me so much. I walked away from it a really badly built training website, but so much understanding of Webflow worked. Things started to click.

This was a game changer. It brought me back to my time as a web designer, it meant that I could design a site and then build it myself. I actually felt giddy. Complete control right to the end. I wanted to learn more and more. I challenged myself to build my portfolio site to get an even greater understanding of the tool. I designed a half baked portfolio site in Figma and then jumped into Webflow and built it. It completely changed my design process. I was designing as much in Webflow as I was in Figma.

I was changing my original design in the code because I was seeing how it felt in the actual browser. It felt empowering. I was adding animations, transitions, subtle gradients, all the sort of stuff that would of been heartache to describe to a web developer. Plus, it meant I had the ability to build my own portfolio in a way I wanted it to look, without using a crappy Dribbble or Adobe portfolio template. (To be honest, looking back I probably over did the transitions and general style, just because I was trying to see what Webflow is capable of)

You can judge for yourself: www.alpower.xyz

Alpower.xyz

Moving forward, I wanted to try see if I could find ways to add value for the business using Webflow. I took on a small side project to build out a 2022 - Year in Review page for our users, and once again, used it as a way for me to learn more about how Webflow worked. The output went down very well across our users, and people within the business started to see how powerful Webflow really was.

2022 — Year in Review

Soon after an executive decision was made within Shortcut to build out the whole shortcut.com site using Webflow. Webflow was becoming more and more popular across the industry, with some huge Saas companies choosing Webflow as their main website CMS which meant it must of been secure, trusted, and an actual viable option! It also meant that we could free up 2 developers that worked on the site full time to mover over and work on our actual app, leaving little old me to manage the website.

So we took it on. We rebranded and redesigned the whole site, and got an agency to work closely with us to build it using Webflow. The guys at 5Four Digital absolutely nailed it, passing over a top notch Webflow build of the designs we provided, educating us on how the CMS worked, and how to manage the core site. Them guys are 🔥 Go check them out (after you finish reading this article obviously)…Then it was over to me to take control. Sink or swim time….Since the main rebuild, I’ve worked on multiple new pages and layouts including rebuilding the homepage and they’ve turned out pretty great! I’m constantly amazed at how powerful Webflow can be!

Our latest homepage!

To be honest, it’s been a huge learning curve for me, but it’s really empowered me as a designer. I now control our whole brand identity as well as manage and build out our marketing site. If we need a new homepage, I design it and then build it in Webflow. If we need any stand alone landing pages I can use the components to create something in minute which before could take days to do. If we want to make some small edits to the navigation, boom. I can build out almost anything thats needed within reason. Yes, I’m still learning, I think I’ll always be still learning. I challenge myself constantly, but that’s what it’s all about. You need to challenge yourself. I see this as a progression in my career. It gives me another dimension as to what I can offer as a designer. It allows me to build anything I want, well, at least try. To any designers out there who are thinking about trying it out, I’d highly recommend it. It opens up so many doors.

Various bento cards we’ve applied to the homepage

If you’ve any questions, or have found this helpful, feel free to pick my brain (or whats left of it) over at:

// Twitter // Dribbble // Behance // Portfolio site //

--

--