Weebly makes it easy for anyone to build a website or ecommerce online presence and then market their business—using just one platform. We’re thrilled to say they’re part of the InVision community.
We sat down with Vitaly Odemchuk, Head of Design at Weebly, to discuss building team trust, empowering designers, and designing for Amy.
How is the design team at Weebly set up?
We separate our 13-person design team into 2 categories: product design and brand design. The team has a fairly flat structure, and each designer is dedicated to a “squad”—a smaller team made up of design, PM, engineering, and possibly other teammates. A squad focuses on or owns a particular area of the product.
We also have a design engineering team that helps all Weebly squads but primarily maintains Orbit, our UX/UI framework.
“Teams needs to trust each other before they can meaningfully collaborate.”
Are there things you’ve changed along the way to help your team collaborate better?
Our designers sit together to optimize collaboration and maintain consistency in brand and product process and frameworks, though they’ll also “co-locate” to sit with the engineers at any given time during the design process.
We work off a leveling system that helps each designer understand where and how they can “level up” in competency, responsibility, and career path.
We used to follow a basic “roles” approach, but we wanted to encourage a more clear path of growth and development that lends to a more design leadership approach. We wound up writing a set of principles that define what makes a successful leader, inspired by Cap Watkins’ leadership principles.
How have you built trust with your team?
Teams needs to trust each other before they can meaningfully collaborate.
We’re a really close-knit team. We go on lots of design trips, and half of them we don’t even ask the company to pay for—we just want to go hang out. We recently went to Tahoe, rented a big house, and just hung out for a few days.
And I think that’s really a statement to the trust we’ve created within our group—it helps us build the best possible experience.
“We’ve left almost every app we’ve ever used because InVision does so much.”
How do you stay focused on who you’re designing for?
We’ve identified 3 different personas, but we mainly focus on one of them: Amy. She represents the core users who come to Weebly to start a business.
We actually have a picture of her. We’re always referring to Amy and how Amy would do this, and Amy has this legitimate life, and with even the smallest of interactions we’re like, “What would Amy do?”
What is the design culture like there?
Weebly was founded by people who deeply value design, so design has always played a very important role in the business. Justin, the first employee, is a designer—and he’s still here.
That said, all of our designers are leaders and empowered to drive their areas of ownership with autonomy and purpose.
Our culture is all about mutual respect and radical transparency. This helps foster an environment where our team embraces the opportunity to spend time together both as friends and as professionals. We try not to take ourselves too seriously.
Are there certain spaces within your office that seem to encourage collaboration more than others?
One of the coolest things about our office is the Design Lab, a safe space for designers to snag for ad-hoc feedback and reviews. It’s a place for us to hang out and be loud without disrupting others. It’s a place for honest conversations and collaborative input.
All of the designers in the company sit together, which is something that’s been challenged in the past, but we’ve found that it helps to foster a creative atmosphere by offering lots of informal interaction for input and feedback.
How does your team communicate with each other?
Slack and InVision keep us on the same page. All of our creative input and feedback is captured as comments on concepts and mockups within InVision.
We also use Jabwire, a scrum/sprint tool created by our VP of Engineering. It’s a powerful tool to help plan and execute engineering initiatives, track bugs, and also communicate with engineering from design.
We’ve found email to be a time suck—we’re more likely to tap someone on the shoulder or round up an informal working session than to send an email to the team. Email is like a virus: 1 email can easily turn into hours of work across the team. It’s better just to talk it out in person.
What’s the most powerful part of your design process?
We place a heavy emphasis on the earliest stages of the design process. Collecting feedback on our research, info-mapping, and low-fidelity concepts surface the difficult conversations at the beginning of a new feature or initiative. It forces designers to communicate the foundational rationale behind their decisions, and helps prevent rework later in the flow.
Another powerful part of our process is that we validate our directions and assumption with real users.
What are the most important values you try to see reflected in your designs?
Honesty and empathy are paramount in everything our designers do—they’re also traits that we consider necessary in being good human beings. We view design as opportunity to showcase how much we care about our users.
If we can save people time, then we feel like we’ve served our purpose.
“The best thing you can do is put a user between you and your work.”
How does your team document collaboration?
Our designers can use any tools they feel best support them. That said, we’ve found that certain tools really serve us the best, especially Sketch and InVision.
We have 2 big whiteboards in our Design Lab that we fill up daily with ideas.
Several team members collaborate fluidly using Google Docs, while others prefer to host live design sessions where they create mockups in real time based on collaboration with others.
When in doubt, go with face-to-face communication.
How do you hand off designs to the engineering team?
Weebly’s design engineering team implements and maintains Orbit, our internal style guide framework. All of our forms, controls, and presentation layers live in Orbit as templatized code for the rest of the engineering team to reference as they build out new features and products. This single-source approach to building out our interface means that engineers can largely implement a design based off a simple Sketch mockup held in InVision. Orbit predetermines all of the spacing, typography, and controls.
As far as process goes within a sprint, we call this phase execution. During execution, we might sit with the squad’s engineers and help walk them through the design. Although they’re always part of the initial discovery, this is a good time to surface design changes since they’ve last seen the InVision screens, and cover any nuances or interactions.
How do you know when you’ve created a good experience?
A great experience for our users is often one that we feel proud in delivering and standing behind as designers, has tested well in our user research, creates positive reaction on social media and our support center, and helps drive traffic and revenue to the sites of our customers.
We believe that designers don’t build the user experience—users do. We merely design the path they travel down.
Ultimately, validation in early user testing helps us make the right decision.
“The more usable and streamlined our designs are, the better our business does.”
How do you use InVision?
We’ve left almost every app we’ve ever used because InVision does so much. Our team mainly uses InVision for organizing and managing projects. It helps us break down our process and communicate clearly along the way—all in one place.
Through each stage of our design process, artboards are synced from Sketch to InVision. We label prototypes in InVision to match the phase of the assets they hold. The way we use InVision to accomplish this might be a bit unorthodox, but it’s crucial in our ability to effectively communicate to all stakeholders.
“InVision helps us communicate clearly along the way—all in one place.”
We also hold regular product design reviews with stakeholders and the team where we leave comments directly on the designs in InVision.
Once feedback has been addressed and integrated to the design, a designer will mark it as resolved.
Where do you see design headed?
We used to envision an industry where UX design and visual design were separate disciplines, but as services begin to converge around a few very stylistically defined platforms—Android and iOS—it seems more and more likely that design will become a reference to usability and less about visual style.
All platforms will adopt best patterns and slowing merge to an indistinguishable one that’s only different in visual styling. And user testing will evolve to a point of less friction and better insights. The best thing you can do is put a user between you and your work.
Design will be equal to experience and usability, and visuals will aid that experience.
What’s your best advice for young designers?
Start something. Then don’t give up.
Develop a refined sense of quality and taste while you’re young. Be discerning about what tools, services, and brands you let into your life. Your taste will define the level at which you aspire to design for the rest of your career.
Take every opportunity that arises to participate in the creation of products. So many unexpected things can happen between creating a mockup and shipping an actual product—and it makes you realize that’s where design talent shines.
Photos by Peter Prato.
