Devetry Has a New Website! Here's How We Built It

Devetry

2022-05-09T19:25:57.049Z

Zigzag

Take a look around at our sweet new design.

*Gestures Broadly at Everything*

Last summer, the marketing team at Devetry made the decision to embark on a new website project. Our old site was fine. It helped us grow from a small company to a medium one, but we knew we needed to step up our game to continue success.

We also knew we could hit the easy button and outsource the design and development to a web design agency. But we’re designers! And we’re developers! So we kept the project 100% in-house, both to own the quality and to QA our web development process.

Here’s how we did it.

Our Web Design and Development Process

Branding: We started by asking questions like, “how do we want people to feel when they visit our site?” and “what personality words do we want to be associated with our new website?”

A new design system: Then our UX/UI team created a new design system, focusing on new colors, typefaces, core website graphics, and buttons.

Information architecture strategy: We analyzed our current software offerings, how they relate to one another, and the shifting market. How can we present Devetry in a logical, concise way? This architecture later became our sitemap.

Content priority guides: What comes first--content or design? In our case, we chose content priority guides. These loose content outlines create placeholders for content, giving designers general guidance and freedom to start from scratch.

Individual page design: Once the designers know the content flow of the page, they began designing. We started with three pages we knew would be most important: Case Studies, Homepage, and Our Approach.

Let’s iterate! These three pages became the focal points of our new website, each illustrating our story and offerings in a distinct way. Of course, we had many iterations.

Remaining content creation and finalization: Once our core pages were established, we kept trucking. Additional content guides were created, followed by design, and additional rounds of iteration.

Begin development work: Before we were 100% finished with the design stage, we passed along the approved designs and assets to our development team. The development team was able to test multiple CMSs and find the most suitable one. We ended choosing Gatsby on Netlify using React.

Wrap-up development: Development took a few months, requiring two devs and a tech lead.

Website launch checklist: There are a number of best practices that should be followed during a web launch. Things like 301 redirects, 404 monitoring, speed tests, and general QA.

Hero quote

The new design system provides a wider palette for creative executions. It represents the unique ways in which we design and develop solutions for our clients.

- Logan Bishop, Lead UX/UI designer

So browse and enjoy our new Devetry digital experience. We hope you like it.

Also a big shoutout and thanks to Billy Wood, the motion designer who created our homepage animation video.