Skip to content

Design and implement a full rebrand with updated design standards and a new design system.

DesignSoftware engineering

Overview

Stackblitz approached This Dot Labs to help rebrand their public facing sites with updated design standards, and sync the design systems of multiple subdomains’ sites across disparate codebases.

Services Provided

This Dot Labs developed a design system rooted in previous branding, but updated to express the speed and uniqueness of this release.


It incorporates impactful 3D graphics, bold colors and statements, consistent themes throughout disparate subdomains, and sets the framework for future messaging and layouts.

Tech-stack

ReactJS ReactJS
 Eleventy
 Docusaurus
 Greensock (GSAP)
 SCSS
 Blender
 Figma
 Illustrator
 Photoshop
  • React for an interactive front end.
  • Docusaurus for the documentation site.
  • SCSS for versatile styling.
  • Figma for prototyping and collaboration.
  • Illustrator for vector images and optimization.
  • Eleventy for the blog site.
  • Greensock for animations.
  • Blender for 3D images and animations.
  • Photoshop for gluing it all together.

This Dot Labs is a development consultancy focused on providing staff augmentation, architectural guidance, and consulting to companies.

We help implement and teach modern web best practices with technologies such as React, Angular, Vue, Web Components, GraphQL, Node, and more.

StackBlitz is the company behind StackBlitz Enterprise, a platform providing an integrated development environment for developers and teams wanting simpler collaboration, cutting edge documentation with live examples, and the most secure development experience available to the market.

Multiple screens from the stackblitz project

Wiring Parts of the Whole

Overall, this project was a practice in braiding together many aspects of StackBlitz’s software collection, and distilling a largely undefined, novel technology’s use cases into digestible but impactful literature, web experiences, and consistent, on-brand graphics.

Overview screen

Responding to User Feedback

In order to provide the most useful and dynamic interface, This Dot Labs team worked with StackBlitz’ to understand the whole of the product offering, not just the newly released technology alone, and user feedback.

This allowed us to tailor more targeted messaging and designs for different demographics, ie. developers using the platform everyday, vs. an Enterprise manager choosing a technology to trust.

Stackblitz project home screen

Creating a Unique Visual Experience

Combining Blender 3D graphics, SVG masks, and the GSAP animation library, we created a unique visual experience for Enterprise customers, describing product functionality with few words, and retina-ready images optimized with low file sizes.

Let’s see how This Dot can help you

If you are interested in learning about how your development team can benefit from a partnership with This Dot Labs, email hi@thisdot.co with questions, or to schedule a complementary one-hour code audit.

You might also like

Portfolio

This Dot Labs supports companies and individuals as they grow their web based technologies.

See full portfolio