First Time ExperienceJune 6, 2020

GraphCMS

I’ve tried a lot of CMS’s over the years but I specifically wanted to try out using GraphCMS as Friction Log’s headless CMS and I wasn’t disappointed.

with Rick Blalock

GraphCMS’s simple introduction to terms and concepts was very well done: Not a lot of links or things to do, just focus on the small amount of content that introduces you to the product, and then you’re off to the races.

I was able to move the whole website on to GraphCMS in under 2 hours!

About the tester

I have extensive experience with GraphQL, with CMS’s, but have zero experience using GraphCMS, so this is a first for me.

The goal of this friction log was to take the blog posts I already had in markdown and move them to the CMS and then have the Friction Log website use GraphCMS to compile the content.

Logs 18

Friction

Signup

The social options were greyed out because the terms acceptance box wasn't checked, which was at the bottom of the form. If that is required before those options, it should be more obvious or at the top. I thought it was broken.

Friction

Create screen

I had some minor confusing of the labels "Name" and "Description”. They look like they have help text that says "Select a region where your content will be located", as if that was part of it, when it's actually part of the map.

Friction

Creating a model

It'd be nice to show the user what the data schema and/or an example of what the JSON will look like when choosing the naming conventions.

Friction

Tutorials in YouTube

The initial video you land on in YouTube, which you come across when you’re on an empty project screen, should have a list of tutorials in the description instead of having to look for them in the channel.

Friction

Intercom bubble hides things

The Intercom chat bubble covers up anything in the bottom right. e.g. When saving a model, or when there’s an error, or anything that causes a message to pop up in the bottom right, you can click it or sometimes see it.

Friction

Editing a model feels sluggish

The load times when saving/deleting/editing feels a little sluggish. It’s not terrible but it’s noticeable.

Friction

Adding an enumeration breaks the flow

It's slightly annoying when creating an enumeration takes me out of the model creation flow. Also, when going back to "dropdown" after creating an enumeration, you don’t get the option to create a new enumeration.

Friction

Productivity with keyboard shortcuts

I found my self doing things enough to where I started looking for keyboard shortcuts. There doesn't seem to be keyboard shortcuts for quickly navigating around, saving work, etc.

Friction

Enumeration values

It’s not clear why you can’t have normal text based enumerations. i.e. enumerations can’t have a human readable value, you’re stuck with my_enumeration_name. From a GraphQL perspective it’s obvious but not from a CMS / content structure perspective, so it feels like a limitation or forcing a technical aspect to the content structure. As a result, I couldn’t find a way to make dropdown have a human readable value.

Friction

iPad keyboard shortcuts

Part of my time setting this up was on an iPad, which was actually a decent experience. One thing I ran in to was the inability to use editing shortcuts, like cmd+b to make text bold, in the markdown editor.

Friction

Webhooks

I couldn’t try out web hooks without paying, to see how I can insert this in to our NextJS/Vercel deployment flow.

Friction

Editor experience is lacking

The markdown editing experience is nowhere close to the experience I was expecting, because I use Ulysses and VSCode for most of my markdown writing. Even something like Medium would be nice. As a result, the editing area of content isn’t a place I’d spend writing articles, so I end up copy/pasting it so I can get the experience I want.

Friction

Content list doesn't retain filters and sorts

I tried several times to customize the content table (remove columns, add a filter, etc.) but they don’t retain the settings across session.

Blocker

Inability to do some things on an iPad

When using the iPad, I couldn’t tap or click on the “Relation” option for a model because I can’t scroll far enough down (The Intercom bubble covers it up). Note that this is using the Magic Keyboard for the iPad.

Delight

Create screen has some cool info

Showing the delay in milliseconds of the regions from where you’re currently at is a really fun attention to detail. I’ve never seen something like that.

Delight

"Preview in playground"

There’s a few spots where you can click “preview in playground” which takes you to the GraphQL playground with the query already written. This was very nice, from a developer’s POV.

Delight

Creating an API for structured content is effortless

Creating the structure for content is so easy and you get GraphQL resolvers with everything you need.

Delight

Image transformations!

Being able to transform an image in GraphQL is awesome! e.g.

heroImage {
  url(
    transformation: {
      image: { resize: { width: 800 } }
    }
  )
}
Sign up for updates

Friction Log © 2020.