Skip to main content
More in Learn

Web Development with Crystallize

Our Livestreams are made to demonstrate key features of Crystallize, as well as integration with a number of different technologies.

You’ll receive wisdom directly from the designers and developers who make Crystallize possible.

Headless PIM

Headless PIM with Crystallize #1 Data Modeling

Join us for the kickoff of our Headless PIM livestream series as we delve into the essential topic of data modeling. At Crystallize, we refer to this as crafting your product universe. This session will guide you through defining product types, attributes, components, relationships, and beyond.

Headless PIM with Crystallize #2 Price Management

Second out in our Headless PIM livestream series is focusing on price management. We dive into the different possibilities around B2C vs B2B, multi-market pricing, subscription prices, and price lists.

Headless PIM with Crystallize #3 Digital Asset Management (DAM)

In this episode, we explore Digital Asset Management within Crystallize. Join us as we delve into uploading, organizing, sharing, and delivering images and various digital assets. Discover how integrated image handling can optimize workflows and unlock exciting new opportunities for showcasing products using interactive hotspots within images.

Headless PIM with Crystallize #4 Information Architecture

In this episode, we're diving into Information Architecture (IA). Discover how product information is stored, organized, and labeled in Crystallize. Learn about the foundational elements of your product universe, including the catalogue, grids, and topic maps, all part of Crystallize's robust organizers.

Headless PIM with Crystallize #5 Importing & Synchronizing Product Data

In this episode, we delve into the intricacies of data import. Learn about various methods to import product information into Crystallize. We'll cover manual input, copying and pasting from your favorite spreadsheet, importing and mapping from spreadsheets, leveraging the import SDK, and utilizing the GraphQL API directly. Don't miss out on these essential tips and techniques to streamline your data management process.

Headless PIM with Crystallize #6 Access Control

In this episode, we explore role-based access control. We'll dive deep into defining roles and assigning them to users, covering the differences between API permissions and UI preferences. Learn how to secure user access and optimize the user interface for an even more efficient experience. Don’t miss this essential session on enhancing security and usability in Headless PIM.

Headless PIM with Crystallize #7 Data Quality & Governance

In this episode, we explore the essential topics of data quality and governance. Discover how to maintain high-quality product information by implementing data quality rules and learn about governance through access control and content creation workflows. Additionally, we'll show you how to enhance your Crystallize experience with channel-specific content quality apps.

Headless PIM with Crystallize #8 Language Management

In this session, we'll explore effective language management in Crystallize. Discover how to configure the platform to support your multilingual strategies, along with best practices for managing translation workflows.

Crystallize Basics

Event-Driven Orchestration with Webhooks in Crystallize

Join us for an in-depth exploration of event-driven orchestration within a composable architecture using Crystallize. In this livestream, we'll dive into the fundamentals of Webhooks, detailing their design and how they seamlessly connect multiple services in the API ecosystem. We'll provide practical examples and use cases, demonstrating how to create and integrate Webhooks effectively. Additionally, we'll discuss common scenarios and best practices to enhance your understanding and application of this powerful technology.

Content Modeling for eCommerce (Part 1)

This stream focuses on the topic of content modeling for eCommerce. Different content modeling approaches are discussed, with a real-world example of modeling for an online bookstore. The content modeling is done using Crystallize.

Content Modeling for eCommerce (Part 2)

This stream focuses on the topic of content modeling for eCommerce. Different content modeling approaches are discussed, with a real-world example of modeling for an online bookstore. The content modeling is done using Crystallize.

Content Modeling for eCommerce (Part 3)

This stream is the last in a series of 3 on the topic of content modeling for eCommerce. Product bundles are the headline for this stream. Bundles of products and product variants are covered in detail. Also, how you can create product variant-specific bundles. The content modeling is done using Crystallize.

Export Your Product Catalogue to PDF with Crystallize

In this Livestream video, Stavros, Partner Manager, and Bård, CEO of Crystallize, are generating a product catalog via the Crystallize GraphQL API in PDF format. They are doing it live with an example and go through the code, which you can find here.

Headless Architecture with GraphQL Service API

Stavros (Partner Manager) and Håkon (Head of Engineering) talk about modern headless architecture and Crystallize Service API that has the purpose to tie all the different services you’d be using together and present it to any given frontend.

Bootstrap Your Tenant with Crystallize CLI

The following Livestream video will help you learn how you can bootstrap your Crystallize tenant with shapes and data.


Subscription Masterclass

Subscription Commerce Masterclass Part 1: Basics of Subscription Commerce

Welcome to our Subscription Commerce Masterclass, where we’ll dive deep into the essential concepts of building a successful subscription-based business. In this first episode, we’re covering the foundational aspects of subscription commerce, from understanding different business and pricing models to creating your first subscription contract live on screen.

Subscription Commerce Masterclass Part 3: Subscription Renewals, Billing, & Orchestration

Discover the ins and outs of subscription renewals in this episode. We’ll explore the renewal process, from triggering and managing billing to orchestrating workflows with fulfillment pipelines. Plus, watch live demos on setting up webhooks, handling pre- and post-paid models, and integrating multiple payment providers.

Subscription Commerce Masterclass Part 2: Usage-Based & Multi-Market Subscriptions

Join us for Part 2 of the Subscription Commerce Masterclass, where we explore advanced strategies for subscription businesses. We’ll dive into multi-market pricing models, covering currency and regional price variations. We also cover usage-based subscriptions, discussing ways to meter features like seats, API calls, and storage. Watch as we demonstrate live how to set up tiered pricing and create flexible subscription contracts for global and usage-based models.

Tutorials

How to Build an eCommerce Store With Astro

This livestream covers how you can use Astro in combination with Tailwind and Crystallize to build an eCommerce store. We'll focus on the open-source Astro accelerator for Crystallize and see how you can use this as a starting point to fetch products, render them in Astro, and place an order.

Checkout Flow 101 using Crystallize APIs

In this livestream, we dive into the Crystallize APIs to perform a round trip of the complete eCommerce checkout process. You learn how to fetch a product, add products to a cart, create an order intent, and finally push the order to Crystallize.

This is a followup to the livestream focusing on the Shop API.

End-to-End Testing in eCommerce

End-to-end testing enables you to automate quality control of crucial customer journeys in your webshop. In this livestream, we cover end-to-end testing best practices for eCommerce. We dive into testing crucial journeys like the cart and checkout process, show examples of how you can set up these tests, and explore the code to see the details of how it's done.

Testing & Fixing Web Performance and Page Speed for eCommerce

Milliseconds matter. In this livestream, we cover why you should do performance testing, tools you can use for performance testing, how to understand the test results, and how to fix them. We also cover the new Core Web vital metric interaction to next paint (INP) that will be introduced in March 2024 and replace FID. Now is the time to measure and improve to be ready for Google's next update. As we say in Crystallize: let's go Milliseconds hunting.

Building a Custom eCommerce Store From Scratch (Part 1)

In this series, we’re building out a custom eCommerce storefront from scratch using Crystallize as a headless eCommerce service, GraphQL as the query language, and Remix for the frontend framework.

Building a Custom eCommerce Store From Scratch (Part 2)

Responsive images are essential for a great user experience and vital for site speed. In this video, you’ll learn how to use the HTML elements picture, figure, and img with the properties srcset and sizes to ensure the browser loads the right image size for a given screen, using plain HTML and a React library to simplify the developer experience.

Building a Custom eCommerce Store From Scratch (Part 3)

In this series, we’re building out a custom eCommerce storefront from scratch using Crystallize as a headless eCommerce service, GraphQL as the query language, and Remix for the frontend framework. Part 3 focuses on CSS styling.

Building a Custom eCommerce Store From Scratch (Part 4)

In this series, we’re building out a custom eCommerce storefront from scratch using Crystallize as a headless eCommerce service, GraphQL as the query language, and Remix for the frontend framework. Part 4 continues with a focus on frontend styling with CSS.

Building a Custom eCommerce Store From Scratch (Part 5)

In this series, we’re building out a custom eCommerce storefront from scratch using Crystallize as a headless eCommerce service, GraphQL as the query language, and Remix for the frontend framework. Part 5 focuses on tidying up our components to handle pricing and variant selection.

Building a Custom eCommerce Store From Scratch (Part 6)

In this series, we’re building out a custom eCommerce storefront from scratch using Crystallize as a headless eCommerce service, GraphQL as the query language, and Remix for the frontend framework. Part 6 focuses on creating the cart, a vital step in our journey towards a full checkout process.

Product Updates

Multi-Dimensional Taxonomies with Topic Maps in Crystallize

This livestream covers how a well-crafted taxonomy can enhance your customers' shopping experience. Discover how effective product tagging and navigation structures can lead to faster product discovery and improved descriptions, ultimately boosting your eCommerce conversion rates. We’ll demonstrate using topic maps in Crystallize to enrich your product information with a comprehensive taxonomy.

Special Prices with Promotions in Crystallize

Join our livestream as we dive into the Promotions feature in Crystallize, the headless eCommerce platform. Learn how this powerful feature can influence discounts on cart products through the Shop API. Discover how to specify which items trigger discounts and how to apply these discounts to other items in the cart, giving you full control over the total cart value.

Building Rich Content with Multiple Repeating Block Choices

In this livestream, we explore the possibilities enabled by the multiple choice component in Crystallize. Learn how to effortlessly create composable landing pages with repeating blocks of components. Develop rich yet semantically structured product landing pages to enhance your storytelling.

(Work)Flows with Crystallize

In this livestream, we dive into the Flows concept in Crystallize. Flows allow you to define any number of custom workflow pipelines to orchestrate your content creation, campaigns, translation workflows, product updates, and more.

Composable Content Modeling with Pieces in Crystallize

In this livestream, we cover the new pieces concept in Crystallize. This is the bit that unlocks true composable content modeling in Crystallize, allowing you to create reusable, pre-defined pieces of content structures, and even enabling polymorphism for your shapes.

Introducing the Crystallize Shop API

In this livestream, we introduce the Crystallize Shop API, completely running on the edge. You learn how you can use the Shop API to manage carts, pricing, tax, etc. both automatically and in the good old un-opinionated calculations. State management of carts and how you can place orders in Crystallize.

Component-Level Permissions & Best Practices Using Roles in Crystallize

This livestream is a product update including the component-level permissions, how it works and what some best practices are. The updates on component-level permissions allow you to create fine-grained permissions with selected components and free-form reordering. Editorial users can get a personalized editorial experience just focusing on the content that is relevant for them.

Visual Shopping with Image Hotspots in Crystallize

This product update is focusing on how you can showcase products and marketing content in images. Adding semantic references with hotspots to the featured products allows for a new way of visual shopping. Now natively part of the assets in Crystallize.

Introduction to Archiving in Crystallize

Join us for a session where we walk through the new capabilities in Crystallize for archiving and versioning. Frontend lead Vasil will walk us through these new capabilities.

Roles & Permissions

Join us in this livestream to learn how the new gamified Roles & Permissions in Crystallize works. Live demos and behind the scenes information on the approach and design principles.

Organizing Assets for Reusability with Lightboxes

In this stream, we’re going to talk about how we can take advantage of the lightbox drawer (a feature of Magic Paste) to better reuse assets when creating products.

Shop Examples

Building the Backend for Your Back-to-school Store with Crystallize

Setting up your backend is key when designing any ecommerce experience. It allows you to market and sell your products the way you want, after defining a content base. In this Livestream, we dive into an example of setting up a back-to-school eCommerce store.

Gift Cards and Vouchers with Crystallize

Learn how to create, handle and redeem gift cards and vouchers with Crystallize. We will go through different scenarios of how this can be enhanced to handle your specific business logic.

How to Set Up Vouchers in Service API?

In this session, we will go through the process of defining a set of Vouchers in Crystallize, and use them during checkout on the NextJS boilerplate.

Content Modeling for Online Food Store

Learn how you can design and implement a content model for an online food store. We will show you how you can use the open-source Figma design system for content modeling and implement the model in Crystallize. You also learn how you can create the content and how to access it via the GraphQL headless eCommerce API.

Design, Build and Launch React Norway Conference Site

React Day Norway 2021 happened online this year. Prior to the launch, we did a Livestream where we build the new conference website LIVE to kick off the call for papers.

Google Recommendations AI for a Personalized eCommerce Shopping Experience

In this Livestream video, we’ve shown you how you can use the Google Recommendations AI service to create a personalized shopping experience on your webshop. A fully working implementation using React, Next.js, and Crystallize is used and shared in this session.

Building a Premium Video Streaming & Content Website With Paywall Using React + Next.js

This Livestream video covers how you can launch a site with members-only premium content. We discuss strategies for premium or member-only exclusive content and show how you can create this in Crystallize with video streaming powered by AWS Elemental. The frontend is using React / Next.js and is hosted on Vercel. Using Vercel Edge redirects to keep the site as fast for members and visitors.

Internet Craftsmanship

Next-Level Product Visualization and Configuration with 3D and AR

In this session, we will explore how you can utilize the current capabilities of hardware-accelerated 3D visualization to achieve beautiful product presentations on standard mobile and web browsers. We will examine the technology behind it, how you can visualize your products, and how you can create stunning 3D product configurators with AR. You will learn how to use and set up a model viewer and apply it to your own project.

People showing thumbs up

Need further assistance?

Ask the Crystallize team or other enthusiasts in our slack community.

Join our slack community