Products like Webflow and the few other visual code-creators are setting a new tone for investing time and money into a design career. It has a been a necessary progression for the digital industry to have such a tool like Webflow, which being much more than a WYSIWYG editor, creates visual and interactive scenarios with HTML, JS, and CSS. With their recent launch of Interactions 2.0, which allows you to create really powerful interactions and animations, almost everyone in the design industry has now heard about Webflow and their team. And with this growth, Webflow is starting to become an industry standard for frontend developers, designers and even graphic artists, helping bridge the gap between aesthetics, layout and function.
Going behind the scenes, we speak with Ryan Morrison, the Brand Design Lead, who talks about learning from co-founder Sergie Magdalin, growing the internal brand design team, and working on various marketing efforts. Having helped launch much of the company's growth efforts, including Webflow University, Interactions 2.0, and redesigning their web presence, Ryan guides us with, both life working on tech's new sweat-heart product, and also how he decided to drop the college plan and go straight into design. "Though I had done a handful of cleaning and construction jobs before, I got my first full-time job a month out of high school as a designer. Before graduating, I had enough work to put together a portfolio on Cargo Collective, and eventually the right person showed the right person my work, and I was hired with no interview." Ryan speaks quickly and makes us aware that the decision to not go to college was entirely his own.
His illustrations and style that is embedded within them are unique, and carry themselves as little transparent-gradient gems. Using gradients as a core element in these illustrations, Morrison has been a core part of the cutting-edge and translucent graphic style that Webflow is seen for. Waldo Broodryk, Webflow’s Customer Happiness Hero Manager, has recreated many of Ryan's illustrations, giving his "2D div blocks life in Webflow without using any images". The simplicity of Ryan's illustrations can be seen as being a large reason why the Webflow team has continued to build product demos like Waldos, showcasing what Webflow can do when it comes to movement and interactive situations. Bridging the gap between graphic design and web is something that Webflow has made Ryan an example out of.
Aside from illustrations, Ryan was given the task along with Barrett Johnson and the original co-founders to redesign the Webflow website. Introducing a new facelift for their web presence, graphic assets, fonts and color-palette, Ryan focused his attention to a holistic overview of the company and maintained a sense of balance when they decided to go dark with the color palette and inject the Webflow-blue tints throughout the pages. "In 2017, the homepage of any company is one of the most important pieces of a brand. When you’re designing the homepage of a website, for a web design tool especially, it’s definitely the most important piece of the brand. Communicating information is the easy part, the hard part is knowing who you’re talking to, and what needs to be said."
Digging into his upbringing, how he got started at Webflow and how he is currently growing their internal design team are all things that Ryan says he is currently jumping into pencil first:
Let's start with growing up in California. How do you think helped your early start?
I grew up in a small town named Paso Robles, California. And, we lived in the country, about 10 miles from town. My Mom (thankfully) limited our screen time to 30 minutes a day. In other words, there were very little distractions. It was easy to spend hours upon hours drawing, or doing other creative things that I loved to do.
Another important aspect to my upbringing was that our house always seemed to be falling apart in some way, which taught me to work. There was always work to be done; always something to be fixed or improved. Summers weren’t for vacations, they were figuring out what to fix, so the house wouldn’t flood in the winter, for example. Whether I was chipping away at large projects day by day, or getting through a long list at once, work ethic was ingrained in me pretty young.
So, that combination of having a lot of free time, and the discipline to do something productive with that time, started me off in a good direction when it came time for me to start working at my career.
You have a unique scenario in which you dropped out of college, focused on your portfolio and then jumped straight into your career. Can you talk about this?
Like I mentioned before, I got my first full-time job a month out of high school as a designer. Before graduating, I had enough work to put together a portfolio on Cargo Collective, and eventually the right person showed the right person my work, and I was hired with no interview. I was the only designer for a small startup in my hometown called Daily Systems, which made hardware for iPhones. What made it even more fun was that the CEO also owned two other businesses, so soon after joining I ended up leading the brand design of 3 companies at the same time.
I was very lucky. I got to design, implement, and manage brand identities, as well as build full websites, design for print, create animated videos, and draw those ridiculously skeuomorphic illustrations. Keep in mind, I started this job at age 17, knowing nothing about code, the web, animation, or really anything I was doing. Thankfully, management was incredibly patient, and I got to learn on the job.
While working at Daily Systems, I was also going to college full-time, freelancing on nights and weekends to pay for college, and of course — not sleeping. Not sleeping was an issue, as you can imagine; this is when I discovered the witchcraft most people call coffee.
I ended up continuing this stupidly unhealthy schedule for a year, but during that year, I questioned what the heck I was going to do next year. This is the moment I found out how incredibly helpful the design community is. I began reaching out to designers that had gone to college or design school, asking if they felt it was worth it. I wrote the last paper I’ll ever write on why I’m quitting school, got the best grade I’ve ever gotten on a paper, and never looked back. I had decided to invest in my career, not in school.
A few months later, I joined an agency called Rosetta, in San Luis Obispo.
After Rosetta, you started at Webflow, an early startup. What where your first days like at Webflow, including the onboarding process? Do you remember what you were first tasked with?
At this point in my career I had coded a couple of sites from scratch, and had used Joomla, Squarespace, and way too much WordPress. I was really excited to join a company with such a bold vision. Webflow is setting out to change the way we build for the web, and I could tell they were actually doing it. I didn’t really know what I was getting into, but quickly understood.
Onboarding at Webflow was a ton of fun. My first day I realized that not only was everyone super nice, but also unfathomably skilled at what they do. My first two days were spent building a copy of Dribbble.com — using Webflow. Not just copying the design, but building relationships between data, and using it to recreate some of the main pages of the site. And then of course making my own little animations and interactions because... why not. I started to get to know my boss really well during this time, Sergie Magdalin, one of the co-founders, and learning to be the kind of design manager I want to be, from him.
I hadn’t really understood how lucky I was to have gotten a job at Webflow, but at the end of those first two days, I was absolutely in love with the people and the product. I then understood the capabilities of Webflow, and the trajectory of where it was going. From then on, I’ve put my head down and worked on pushing our brand design in a direction that will allow other designers to discover the feeling I just had. I needed to let the world know Webflow isn’t messing around.
You redesigned the Webflow homepage, can you talk about this project? How did the interactions between teammates occur, since the majority of your team is remote?
Redesigning Webflow.com was a super fun project. Working with a remote team is actually quite simple. Webflow has been setup from the beginning to communicate largely through Slack and GitHub, regardless of what we’re doing, or if we are even actually working with people outside the office.
Not only was this a redesign of the home page, and some of the other main pages, it was a rebrand. Though I didn’t touch the logo, I did introduce a whole new color palette, a new set of fonts, a new approach and system for layout, and a new visual language for icons and illustrations.
This process of discovering a new brand direction was pretty independent, a lot of iteration and thinking with my head down, popping up for critique from coworkers and friends, but (regrettably) not much public testing. Version 1 was meant to speak to Webflow being a tool for professionals, fighting the misconceptions that previous web design tools gave us. The design direction was meant from the start to constantly evolve. As I learn, as I hire, and as Webflow evolves, the brand will have to change, and I’d rather plan for that from the start, than do costly redesigns every few years.
The process of actually designing the homepage involved the larger team, especially my marketing counterpart, Barrett Johnson. When we started thinking about content/UX/strategy of the site, the branding was established enough that we were able to focus. Rather than stress over how the content would be visually communicated, we iterated heavily on content in Google Docs.
In 2017, the homepage of any company is one of the most important pieces of a brand. When you’re designing the homepage of a website, for a web design tool, it’s definitely the most important piece of the brand. Communicating information is the easy part, the hard part is knowing who you’re talking to, and what needs to be said.
In a user test, we watched someone stare at a section with a headline that read, in large type, “Publish with a click, or export the code.” When speaking with the tester afterwards, they were pleasantly surprised you could export the code. Though this was surprising, and bit funny, learning that copy often needs to fight for attention was an early insight into how our audience prefers to take in information. This user test taught us to show, rather than tell, whenever possible. Since then, testing has become a crucial part of our design process.
Has there been anything you have struggled with (either in the processes or deliveries at Webflow)?
Of course! If I was comfortable in everything I was doing, I must be doing at least a few things terribly. Right now I’m struggling most with process. And not my personal design process so much as the process of how my small, but growing design team works within the rest of the company. I’m actually really excited about how much I don’t know about this type of role, and grateful to work out the details alongside the brilliant team at Webflow.
When did you get into writing? You boast a large following on Medium, can you talk about your process? Are you writing for Webflow as well?
I’ve always been a terrible writer. Even now. I only started writing because I like helping people, and that it was the best way for me to do that. Medium is weird. I wrote a couple things that people liked, and I sorta found my voice, and I got a little following. A stranger told me that I’m their favorite writer, which scared the crap out of me. Half of me wants to finish the 20 drafts I have in Medium in hopes that it can help someone be a better person or designer, and the other half of me doesn’t want people to listen to me at all.
I have written a little bit of copy here and there, and one article so far for the Webflow Blog. I like writing for the blog because I get to work with John, our head of content, who is incredibly talented and handsome, and who proofread this article for me.
I was really struck by this quote you wrote about in one of your first posts, “Every decision in your design needs to have purpose. You should be able to go back and explain why every pixel is the way it is”. How have you applied this to your creative process?
This is a paraphrased quote from a designer named Scott Saunders who I met while in high school. It really speaks to the fact that every detail matters. Every decision in a design has an effect. Even elements in a design that people rarely explicitly see, add to the perception of the design as a whole, at the very least. So I don't think anything should be left to chance. For example, though I don’t go as far as drawing custom fonts for every project, I have never used an icon set.
What is in the future for Ryan? Is there a particular project you would like to work on, either on the side or internally at Webflow?
The future for Ryan is to grow a team, and help them become great at what they do. Simultaneously, I’d love to spend more time helping strangers be better people, better designers, or be better at using Webflow.
Lastly what have you learned most about working at Webflow? What have your learned most being in the creative industry entirely?
I’ve learned how people inform tools, and in turn, how tools inform what people do with them. It’s an interesting loop. On top of that, I’ve paid a lot of attention to design trends, even long before working at Webflow. More specifically, what influences trends. What’s especially interesting to me about trends is how they are influenced not only by tools and technology, but also by brands and individuals. And one designer, that makes one thing seen by one other designer, plays a part in steering trends, and in turn, effecting the future of design.
What can you tell someone that is just starting out in the creative industry?
If you’re reading this, and just starting out in the creative industry, you’re probably reading many other things about the industry as well (which is awesome). That means you’re motivated. Nobody can teach you this motivation, but because you have it, the rest will follow. You only really fail when you quit, so work hard, stay motivated, and you’ll do just fine.
*Note Digital Computer Arts is entirely built, hosted and managed on Webflow
