Prismic logo

Technical enablement

Tech enablement deck

Prismic logo black

2024

Prismic Partners Technical Enablement

Prismic for agencies

Prismic logo black

Index

1 Building with Prismic
2 Why you should use Prismic
3 Now it's your turn
Microphone icon
Prismic logo black

Building with Prismic

What is Prismic ?

Our approach

Main concepts

Prismic logo black

Our approach

Prismic is a headless website builder that integrates smoothly with Next, Nuxt and SvelteKit

Tools for both teams

  • Slice Machine
  • Page builder

Slices

  • The common language between Designers, Developers and Editors
  • A simple way to model content for editors

Our SDKs

  • Querying our REST API
  • Templating content
  • Page previews
  • Slice simulator
Prismic logo black

Main concepts

Slice Machine

  • Developer tool
  • Npm package compatible with Next, Nuxt, and SvelteKit

Slices

  • Multi-functional components created via Slice Machine
  • Design components for designers
  • React or Vue components for developers
  • Website sections for content editors

Page Types

  • Page templates
  • Unique URL structures
  • Unique user interfaces

Custom Types

  • For global configuration or settings
  • Can be used for categorization, global SEO, theme etc.
icon
Prismic logo black

Slice Machine and the Page Builder

Why you should use Prismic

Build websites faster

Better content editing experience

Prismic logo black

Build websites faster

Build websites more efficiently

Gain valuable time by building and iterating on your components locally thanks to generated mocks and real-time preview.

Model Reusability

You built some awesome sections on a previous projects, why not reuse them?

Models are saved along with UI components in your code so all models built with Slice Machine are transferable between projects, you can :

  • Copy/paste your models across projects
  • Index all your slices for reusability across different websites like our slice library project
  • Create your own streamlined process to clone a website like our website factory project.
Prismic logo black

Better content editing experience

Flexibility and design consistency

Give autonomy to editors while maintaining your design system.

  • A tailored page building experience for your customers
  • Unique designs
  • Easily manageable content

Worry-free website updates

Slices are branded page sections with variations for content team flexibility. Once developed, they enable editors to build and reuse them across various page types.

  • Simplified workflow to ship a new or updated component to your content editors
  • Synchronized roll-backs
  • Pre-defined set of slices for each page type
Create icon
Prismic logo black

Initiation

Now it's your turn !

Sample Project review and Next steps

Resources

Prismic logo black

Sample Project review and Next steps

Requirements and Support

The sample project must contain at least 3 slices built with Slice Machine and must use the Slice simulator.

We'll provide guidance through a dedicated Slack channel so that you're able to build your sample project and learn how to build websites with Prismic.

Want to make sure you're project is following our best practices ? Browse through our review checklist.

When sharing the project with us, don't forget to include dependencies.

Submit a sample project

  1. We'll review how you use Prismic and share feedback.
  2. After the sample project validation, you will move towards the next step with your dedicated APM, the Business Enablement session.
  3. Once you have your first paid live website submit it for the Full project review
  4. Once the Full project is validated, you are done with the Partnership process ! Your APM will reach out to you to feature your agency on our website.
Prismic logo black

Resources

Build your first Prismic project

  • You can set up your Next, Nuxt or Sveltekit project following the steps from our documentation
  • If you want to learn how to build a Next.js app with Prismic from start to finish you can follow the Prismic Academy course.
  • For video tutorials on how to build a full website with Prismic browse our Youtube playlist.

Project starters

Book icon