Skip to main content
Back to Projects
Full-Stack Website Migration | Grayscale Investments

Full-Stack Website Migration | Grayscale Investments

Led the full 0 to 1 platform rebuild and phased migration from Optimizely to Vercel/Sanity.

ReactNext.jsVercelSanityOptimizelyFigmaMUIStorybookJira

Overview

When I joined Grayscale Investments, I was tasked with leading a full rebuild of the company’s website on a new tech stack. This entailed migrating from a third-party Optimizely setup to a Vercel/Sanity environment built in-house. The project had a tight deadline to avoid renewing costly vendor contracts, so I focused on streamlining the experience while preserving Grayscale’s visual identity.

On top of being the lead PM on the project, I also handled the design for multiple pages across the site. This project truly challenged my abilities, and it was extremely rewarding to see the end result!

Below you'll find a breakdown of the project, highlighting improvements made as well as the thought processes behind them.

Component Library

As part of the rebuild, I helped design and ship a reusable MUI component library, built with scalability in mind so it could be shared across Grayscale’s various web properties. The goal was to establish consistency, reduce duplicate effort, and speed up future development across teams.

We documented the library in Storybook, giving internal stakeholders a centralized place to view, test, and interact with each component in isolation. This not only streamlined collaboration between design and engineering, but also made it easier for other teams to adopt the system moving forward.

PieChart component documented in Storybook

Component design was included in the scope of my work on this project. I designed a handful of net new components in Figma, leveraging UX design best practice while also focusing on adhering to the sleek design language that Grayscale already had in place.

Data Table Component on Grayscale.com

Sanity CMS

Before this project, there was no Sanity instance at Grayscale. This was a complete 0 to 1 build. I led the full implementation, from defining the content architecture and designing schemas to training internal users on the platform.

I was able to pull from my experience at Fox, where I was both a daily CMS user and worked with product on developing that same internal system. That dual perspective helped me design and build the Sanity schema in a way that was optimized for our needs while solving pain points that existed with the Optimizely CMS.

The content architecture had to be broken out across three domains: grayscale.com, research.grayscale.com, and etfs.grayscale.com. Each needed its own specific organization, but I strived to keep uniformity across all three for the sake of CMS UX. This meant organizing document types in a similar fashion, reusing templates as much as possible, and being thoughtful about how any differences were arranged. We also had elements that persisted across all three sites, so organizing those into a top-level Globals folder had to be clean and intuitive as well.

Sanity CMS Globals Folder

Marketing, Research, and Communications are the primary users of the CMS, and I designed the schemas with their workflows in mind. The goal was to reduce complexity and make everything as intuitive as possible.

The main challenge early on was learning what Sanity was and wasn't capable of. That initial research enabled us to build exactly how we saw fit. We leaned on resources from the Sanity team whenever we had questions, and they helped by providing examples from other implementations and clarifying what was possible.

I'm most proud of the fact that I led the build on a fully functioning, robust CMS from the ground up. Our internal users gave a ton of positive feedback, citing how it was much easier to use and cleaner to look at than what we had before. At the end of the day, the number one goal of a PM is to design and develop for the user, and I'm confident I accomplished just that.

Data Transfer

One of our major tasks during this project was the migration of all document files from Optimizely to Sanity. This included around 900 files across all three domains (grayscale.com, research.grayscale.com, and etfs.grayscale.com), primarily PDFs, images, and Excel spreadsheets.

We automated the vast majority of the migration with custom scripts, with some minor manual adjustments afterwards, usually for image files. The scripts pulled documents into our data warehouse, while all other files went into Sanity. This required mapping old grayscale.com file metadata to our data warehouse's tagging system, including file types and attributes for specific document types. We also had to figure out how to link Optimizely document card metadata to each file, since some metadata lived in Optimizely rather than in the files themselves.

During validation, we identified a gap in API connectivity where some endpoints were returning 404 errors. After troubleshooting, we resolved the issues and also filtered out duplicates and non-essential files. Some duplicates were just links to other parts of the site rather than actual documents.

We coordinated closely with marketing, finance, and legal throughout the process to make sure we transferred everything necessary without accidentally deleting anything essential during cleanup.

Migration Script Requirement in Jira

Compliance & Change Control

Grayscale operates in a heavily regulated space, so everything on the website needs to be SEC and FINRA compliant. Any time a "material" change is made, it requires compliance approval before going live.

For the migration, I worked closely with marketing to get approvals on anything that was newly designed or updated. Our compliance team coordinates with Foreside, handing off bigger items to them for additional review when needed.

Each release also goes through a formal change control process. I spin up a Change Request ticket in Jira, linking every work item included in the release, writing up our rollback plan, and detailing what the release will include and when it will go out. Once all work items pass UAT, I get business user approval from marketing, then tech stakeholder approval from either my manager or our CISO. Only after all approvals are in place can we deploy to production.

On the GDPR side, we integrated CookieBot via Google Tag Manager to handle cookie consent. I worked on ensuring that strictly necessary cookies could fire automatically without consent, while analytics and personalization cookies required explicit user opt-in.

Because we involved compliance throughout the design process, we never had to turn around and completely rework anything. This let us design and build with confidence, avoiding costly backtracking.

grayscale.com CookieBot UI

Results & Impact

We delivered at the end of April, about six weeks ahead of the mid-June contract deadline. That was a big win, especially given the limited internal resources we had available.

Monthly visitors increased nearly 3x post-migration, from 155k to 450k. A few things contributed to this. I was able to advise on SEO as we built the new pages in Sanity, which wasn't something I was involved in on the Optimizely site. There was a lot of room for improvement, and our social media team noticed immediately. They commented on how much cleaner and more consistent the SEO titles and images were, which made their social posts look better due to how pages previewed on external platforms.

The new site is also much snappier. We reduced LCP from 4.08s to 1.56s, with faster load and response times across the board. Even leadership noticed and complimented us on the performance improvements.

Beyond the numbers, this project earned trust and respect from our leadership team. The modern tech stack we implemented opened up new feature development opportunities that weren't possible before. And on a personal note, the team became very close-knit during this migration. Definitely a big morale and team-building boost!