Redesigning Snowflake’s University and Educational Services Microsite

READ TIME: 3 MINUTES

Learn how Webstacks worked with Snowflake to redesign and rebrand its educational microsite, Snowflake University.

Snowflake
IndustrySoftware

Tech Stack

Figma
Adobe Experience Manager
Gatsby
Book a consultation

Headquarters

San Mateo, California

# of employees

6300

Use Cases

Web Design, CMS Migration, Web Development

Customer Since

2022

In February of 2022, Snowflake, the Data Cloud company, came to Webstacks with a desire to refresh its microsite, Snowflake University.

Before our engagement, the University page felt disjointed and did not seamlessly complement the main marketing website. Moreover, Snowflake’s education team was frustrated by the inaccessibility of its educational content, and looked to Webstacks for a solution.

Webstacks implemented a fresh design and highly performant front-end solution that better fit Snowflake’s branding, improved content editing, and enhanced the unified user experience. Now, Snowflake has a fast, functional, and mobile-friendly website that better helps educate thousands of enrollees on data analytics and the Snowflake Data Cloud.

Who is Snowflake?

In today's world, data silos make harnessing the value of data time-consuming and expensive. Governance and collaboration are also often impossible to achieve across so many different technologies and clouds — that’s where Snowflake comes in. Founded in 2012, Snowflake enables every organization to mobilize their data with Snowflake’s Data Cloud. Customers use the Data Cloud to unite siloed data, discover and securely share data, and execute diverse analytic workloads. Wherever data or users live, Snowflake delivers a single data experience that spans multiple clouds and geographies.

The Snowflake platform is the innovative technology that powers the Data Cloud — the global network where Snowflake customers, partners, developers, and data providers can break down data silos and derive value from rapidly growing data sets in secure, governed, and compliant ways. Specifically, the Data Cloud is where thousands of organizations have seamless and governed access to explore, share, and unlock the potential of data. With the Data Cloud, organizations can unify their structured, semi-structured, and unstructured data, and securely share that data across their organization, and with their ecosystem of partners, suppliers, and customers. Users gain access to industry data sets, data services, and applications without having to move or copy the data, enabling governed and secure data sharing in real time. With the Data Cloud, organizations can also develop and build new products faster, run machine learning (ML) models to make informed business decisions, drive innovation with fresh data-driven insights, and monetize data and data products in Snowflake Marketplace.

What is “Snowflake University”?

Snowflake University” is an online educational platform that provides training and certification programs for the Snowflake Data Cloud. The platform, run by Snowflake Educational Services offers a range of courses, including beginner to advanced-level training, self-paced courses, and instructor-led courses. The curriculum covers various topics related to Snowflake, such as data engineering, data analytics, cloud computing, and more. Snowflake Educational Services also provides SnowPro certification exams to validate users’ knowledge of Snowflake and data analytics, and enables them to showcase this knowledge and skills to potential employers.

Revamping “Snowflake University”

There were three key objectives Webstacks helped Snowflake achieve with this project:

1. Integrating all educational content into one microsite

Before Webstacks, Snowflake was operating with a disjointed educational experience. Content was powered by different vendors, and existed on separate sites. In addition to the on-demand courses on “Snowflake University” (learn.snowflake.com), there were instructor-led trainings only available through training.snowflake.com, and certification exams available at https://snowflake.useclarus.com.

Naturally, this made it inconvenient for users to find all of Snowflake’s educational content, and challenging for Snowflake to promote the content and make it discoverable.

To make the user experience more seamless, Webstacks transformed the “learn” microsite into a catalog for all three (Certification, On-Demand and Instructor Led courses), which made all educational content accessible on one platform.  

2. Creating a new user interface

Since the courses and certifications are hosted by different vendors, no one site can show all the accomplishments of a user. To resolve this, Snowflake consolidated all the data across multiple microsites into one Snowflake database. The data and pipeline processing powering “Snowflake University” is powered by the Snowflake Data Cloud, proving yet again the power and flexibility of building and deploying applications on top of Snowflake.

Now, users are able to keep track of their complete Snowflake learning journey through a single authentication process. Once logged into “Snowflake University,” a user can visit the Transcripts page, which shows the training resources that user is currently enrolled in or has successfully completed across all the systems.

3. Improving the overall site experience

Lastly, Snowflake wanted to enhance the overall end user experience within its University. This meant adopting a refreshed design that matched its corporate branding, ensuring a more mobile-friendly experience, and decreasing load times. 

Note

Webstacks truly grasped the essence of Snowflake's brand and took the time to understand our specific needs, goals, and challenges in order to create a solution that went above and beyond what we envisioned. The team is hyper collaborative and their commitment to excellence was evident in every aspect,” said Xer Cha, Senior Global Program Manager, Education and Certification, Snowflake.

Building the Design System

As with every website Webstacks designs, we took a modular approach to rebuild Snowflake’s microsite. This meant breaking web pages down into smaller, reusable pieces. Through atomic design principles, we created a design system that set teams up to construct a completely modular website. Rather than using templates, a modular design allows for fluid page layouts, and seamless customization.

In practice, this starts with “atoms”, or the smallest, most simple elements of a website (such as colors, typography, etc.).

snowflake-university-colors
snowflake-university-typography

With atoms, we can move on to create more complex elements made up of multiple atoms (like buttons and sliders).

snowflake-university-buttons
snowflake-university-sliders

Then, we put molecules together to create components. Components are the largest reusable elements of the website, and can easily be replicated for multiple pages. Examples include the hero, cards, card deck, and footer.

snowflake-university-hero-redesign
snowflake-certifications-component
snowflake-footer

Solving the Tech Stack Issue

“Snowflake University” got a significant upgrade on the technical front, with Gatsby as the front-end framework, and Adobe Experience Manager for content management.

A React-based framework, Gatsby.js brings exceptional performance and speed to content-heavy websites. By leveraging the power of static site generation, Gatsby pre-builds the website at build time, resulting in highly optimized and lightweight HTML, CSS, and JavaScript files. By upgrading to Gastsby, “Snowflake University” could achieve faster page loads, improved user experience, and better search engine optimization (SEO).

With Snowflake having such a technically-inclined audience, it was important to use a robust and capable front-end like Gatsby. In doing so, Snowflake could showcase a professional, well-developed website and show that it values the latest and greatest web technologies.

For the back-end, Snowflake was in need of a more customizable solution. The “Snowflake University” page was originally hardcoded,  making it nearly impossible for content editors to go in and make changes. This is a significant pain point that Snowflake’s marketing team was constantly dealing with.

Since Snowflake was already using Adobe Experience Manager (AEM Cloud) as its main marketing website’s CMS, we decided it would be best to employ the same CMS for the University that the marketing team was already familiar with.

Adobe Experience Manager (AEM Cloud) offers many benefits over a traditional CMS. First, it enables Snowflake to streamline content creation and management processes through its cloud-native service, resulting in increased productivity and faster time-to-market. Additionally, its numerous security features such as Multi-factor Authentication (MFA) made it optimal for a large data enterprise like Snowflake.

Designing Each Page

Homepage

snowflake-homepage-redesign

For the homepage, we wanted to enhance the UI by implementing new “Learning Tracks”. This new structure allows users to more easily browse through different types of courses, and ensure they are finding a good learning journey for them to get started with Snowflake.

The old cards were composed of just a symbol and a title, making it difficult to glance and discern what each course was without clicking through.

The new cards include thumbnails, and lots of contextual clues (such as price, course code, and order number), which gives the user much more insight without leaving the home page.

As with every new page in “Snowflake University,” Webstacks optimized the designs for various screen sizes (desktop, tablet, and mobile). This was an area that the previous design severely lacked, and we were able to greatly improve the usability and responsiveness on mobile devices.

Courses Listing

snowflake-course-listing-redesign

With dozens of courses, Snowflake needed a way to better organize its catalog. In addition to search functionality, new filtering by topic and cost helps narrow down results and assist users in locating the right courses for them.

Course Details

snowlake-course-details-redesign

Along with the updated styling, the course details page incorporates a table of contents, and a new “course overview” section, which includes a visual representation of the estimated effort level.

Our updated version consists of multiple tabs, which greatly reduces the amount of scrolling required.

Below the body copy, there is another component that routes users back to the learning tracks if they want to continue exploring other course options.

More call-to-actions also clearly direct users to enroll or discover other relevant information.

Certification Listing

snowflake-certification-listing-redesign

Certifications were moved over from another microsite to “Snowflake University,” which required us to create an entirely new page.

Bold buttons above the fold encourage users to create an account and get started with their certification journey. 

The card deck component was also utilized here to neatly present each of the certifications being offered by Snowflake.

Furthermore, an expandable and collapsible FAQ section was another addition to provide even more context to the user before opting to enroll.

Certification Details

snowflake-certification-details-redesign

Before the redesign, the Certification page was fairly long, which made it difficult for the user to navigate and find the information they were looking for.

Again, tabbed widgets made the page significantly more organized and concise.

Transcripts

snowflake-university-my-transcripts-page

The transcripts page presented a perfect opportunity to add an element of gamification to encourage learners to take the next logical step easily in their learning experience. Gamifying the content and overall user experience created a more interactive aspect to the website, along with providing tangible feedback to learners in their overall progress. The transcripts page, which is Powered by Snowflake, shows just how easily Snowflake can deliver powerful data to applications in support of their data and analytic needs. 

This dashboard showcases each enrolled course, along with a progress bar so users can simply track their work.

Conclusion

The new and improved “Snowflake University” makes it easier for users to explore a vast library of diverse educational content, as well as track their progress as they work through various courses and certifications. The all-in-one platform offers a more engaging and meaningful user experience. 

Not only was this an upgrade for end users, but the project also added significant business value to Snowflake by:

  1. Integrating all learning material into one microsite made for a more seamless learning experience.

  2. Making the platform more visually appealing and functional.

  3. The consolidation of individual courses increased the overall value of Snowflake’s educational content and certifications.

  4. Adopting a new design made the site feel far more reputable, allowing for Snowflake to emerge as a trustworthy, authoritative, and comprehensive source of information. 

  5. Implementing an enterprise-level tech stack aligned Snowflake with its own core competencies.

If you haven't yet, check out “Snowflake University” for yourself!

Note

Webstacks was the perfect partner for helping Snowflake rebrand and restructure its courses and certifications. The team was remarkably fast, and immensely capable of working at our organization’s speed — and even outpacing us,” said Nicholas Goodman, Director, Educational Programs, Snowflake. Goodman continues, “Webstacks was always communicating and constantly delivering from kick-off through launch. Their team ensured the swift progression of the redesign for “Snowflake University,” and ultimately produced an invaluable asset for Snowflake and its thousands of University users.

webstacks-logo.svg

Fullstack product teams to start, run and grow your website

Webstack's Twitter
Webstack's Instagram
Webstack's Linkedin
Webstack's Dribbble
© 2024 Webstacks. All Rights Reserved.