Senior Digital Designer
Seismic is the global leader in enablement, helping organizations engage customers, enable teams, and ignite revenue growth. As a team member on the web team, I was able to participate in page testing, a 2022 spring rebrand, and event branding. Our goals included increasing conversion rates, redefining the brand, and creating beautiful, bold moments.
*An overview of my design work with Seismic
20%
Conversion rate increase
22
Rebranded pages
Hundreds
Of event signups
Request a Demo Page Testing
Challenge
Seismic's Senior Manager of SEO & Growth set up a meeting with me to discuss demo signup drop-offs. He wanted to work together to brainstorm a new approach to the Seismic Request a Demo page that had a similar layout to leaders in similar spaces like Outreach and Zoominfo.
Result
The team launched an 8 week A/B/C test with the original version, a "light mode" of the new design and a "dark mode" of the new design. The light mode version was the overall winner and saw a 20% conversion rate increase.
*Test A "Original" on the left, Test B "Light mode" in the middle, and Test C "Dark mode" on the right
Process
Discover: To kickoff the project, the Senior Manager of SEO & Growth outlined the problems and the desired outcome goals. We wanted to increase our demo signup conversion rate by at least 15% and launch the page within 3 weeks. I asked him to share with me his inspirational demo signup pages that he analyzed as effective and what he visually liked about them. We discovered together that the inspiration pages had similar layouts and included similar assets.
Define: As I went off on my own, I explored competitor pages as well as additional design inspiration. Then I sketched some wireframes with our new layout and business requirements making sure to include the things we agreed on such as G2 badges, logos, quotes, and stats.
Develop: Knowing that this was arguably the most important page on the Seismic website, I made sure to provide several hi-fidelity mockups for the team to discuss together. There was a recent push to add a "dark mode" toggle to our blog, so I even made sure to offer up "dark mode" iterations. We moved quickly through 2-3 feedback phases and decided to launch an A/B/C test.
Deliver: The A/B/C test would launch with the original version that was on the Seismic site, as well as a light and dark mode of a newer layout. The test ran for 8 weeks to determine a confident winner.
*Layout mockups
*Full page view of "Light" and "Dark" mode
Conclusion
After the test ran for 8 weeks, Test B "Light mode" won and saw a 20% conversion rate increase. Test C "Dark mode" came in second and the Test A "Original" saw the least engagement from users. Utilizing quick bullet points, reputable software badges, logos, and quotes allowed our users to confidently decide to sign up for a demo of Seismic.
Spring 2022 Rebrand
Challenge
In the spring of 2022, Seismic underwent an entire rebrand. The web team was tasked with collaborating with the brand design team to ensure we brought the vision to life on the website.
Results
For the website rebrand, I was tasked with creating template pages for "Teams" and "Industries" so that all content on each of these pages matched the same layout and brand consistency. This was intended to improve the user's experience as well as lighten the development team's load to reuse components as they worked to implement so many newer elements. I redesigned a total of 22 pages including the company's "About Us" page which featured a new interactive timeline to engage our end users, show off the company's history, and new brand story.
*Rebranded pages including the "About us," "Customers Stories Hub," "Homepage," and "Industries"
Process
Discover: To kickoff the rebrand on the website, the brand design team walked us through the brand updates and the styles they were pushing the web team to get into development for the launch. My team then planned out how to best tackle the top priority pages and assets.
Define: I was tasked with creating page templates for our "Teams" and "Industries" pages. Within this exploration, I was able to determine new brand assets (such as patterns) that could be used as supporting graphics. I also defined our image styling to live atop a bold colored shape with a transparent background.
Develop: After the template page designs were approved, I moved on to the company's "About Us" page. This page would be building on the branding decisions from the templates. I partnered with a brand designer to bring the new illustrative style to the page in a unique and impressionable way. This was also a page that we agreed that our development team would lean into, so I pitched an interactive timeline design.
Deliver: To handoff the "About Us" page design, I created a detailed new page within my working Figma file. Here, I was able to write callout notes for the developer to detail the functionality of the different sections. Then I specifically detailed the interactive timeline on all breakpoints because this was a net new component that we created.
*Detailed handoff notes for the development team
*Full page view of "Careers" design. Live page linked here
Conclusion
In May 2022, Seismic successfully launched the website redesign. All of the pages had a consistent look that the brand and web team were proud of.
Seismic Shift Annual Event
Challenge
Seismic hosts an annual event called Shift and each year the brand and web design team aim to bring the visual design of the event to the next level.
Results
The teams brainstormed and workshopped for two weeks where we were all focused on creating a new and interesting visual identity for this seasoned event. Utilizing the triangular shapes in the Shift logo, we leaned into a 3D render of a triangle shape to be the main component. We then supported the shape with solid and gradient lined waves to create a unique breath of fresh air in the B2B event space.
*Seismic Shift designs for the Homepage, Hub page, and Speakers page
Process
Discover: To begin my exploration, I went to Dribbble and Behance for inspiration to create a moodboard that fit the event's theme: "Discover the Next Wave of Enablement." I started to look for literal and abstract wave graphics, organic swirls in nature, and 3D textures and layers.
Define: As the teams started to narrow their focus on the waves and 3D shapes, I started to explore and create 3D shapes using lights and shadows. I was also considering patterns we could create to support the web design and use to guide the user throughout the website. After we decided on our shapes and patterns, I started to grayscale wireframe some page layout ideas. I made sure to focus on telling key event details in an engaging and memorable way. The layout had to flow with elements we knew we would be adding to the page.
Develop: In the hi-fidelity design phase, I explored layout and color before I added in the additional assets. I started to use the dark shades in the color palette to call out key sections and draw attention to what we thought users would be most interested in to get them to convert and sign up. From there I started to add in the wave and 3D elements to add life and excitement across all pages.
Deliver: To handoff the Shift event pages, we had to work closely with the development team to export exact sizes for the 3D triangles at all breakpoints. I also created a detailed handoff sheet so that the team could see responsive elements and button states. I closely QA'd all pages on desktop, tablet, and mobile to ensure all designs were matched and animations worked smoothly so that users had the best experience possible no matter the device they were using.
*My mood board for the Shift branding brainstorm
*Grayscale page layout mockups
*Detailed handoff to dev team
Conclusion
The Seismic Shift Annual Event in 2022 was a massive success and the company saw the highest number of signups in the history of the event.
