블록 패턴은 모든 것을 바꿀 것입니다

약 1년 전이었습니다. 나는 행복하게 소설가 지망생을 위한 테마를 디자인하고 있었습니다. 나는 경쟁에서 앞서나가고 2019년 전국 소설 쓰기의 달 챌린지를 시도할 작가들을 위해 특별히 주제를 마케팅하고 싶었습니다.

줄여서 NaNoWriMo는 전 세계 1,000명의 사람들이 50,000단어짜리 소설 원고를 쓰기 위해 키보드를 두드리는 달의 회오리바람입니다. 순전히 의지의 한 달, 갤런 단위의 커피, 영광을 대가로 불면의 밤. 여정이 끝날 때 대상이나 보장된 출판 계약은 없습니다. 인증서, 몇 가지 쿠폰 및 자랑할 권리를 얻습니다. 2018년에 챌린지를 완료했습니다.

불과 몇 달 전의 우승에서 영감을 받아 다음 해에 여행을 떠날 사람들을 위한 테마를 만들었습니다. 나는 또한 소설가 지망생이지만 반드시 도전에 참여하지 않는 모든 사람들에게 그 매력을 확장하고 싶었습니다. 또는 첫 번째 책을 막 출판한 사람에게도 해당될 수 있습니다. 아마도 이것은 몇 명의 새로운 WordPress 사용자를 우리 커뮤니티에 데려올 수 있는 기회가 될 것입니다.

사용자가 구매 버튼을 사용하여 최신 책을 표시할 수 있는 방법을 보여주기 위해 홈페이지 레이아웃을 간략하게 설명했습니다. 그러다 문득 떠올랐다.

블록 편집기에 대한 확실한 경험 없이 어떻게 이 책 판매 페이지를 구축할 수 있습니까?

저는 구텐베르크 플러그인이 WordPress 5.0에 출시되기 몇 달 전부터 사용하고 있었습니다. 나는 시스템의 내부와 외부를 알고 있었다.

디자인은 심플했습니다. 핵심 미디어 및 텍스트 블록, 제목, 몇 단락 및 버튼을 사용하여 일반 사용자에게는 너무 복잡할 수 있는 것을 만들었습니다. 나는 레이아웃을 강조하는 사용자 정의 색상, 글꼴 크기 및 블록 스타일 옵션에 대해서도 알지 못했습니다.

이 단순한 블록 조합은 일부 사람들에게 지나치게 복잡할 가능성이 있었습니다. 더 복잡한 레이아웃에 대한 다른 계획이 있었습니다. 다른 테마 작성자는 더 큰 블록 조합을 사용했습니다. 최종 사용자의 경우 이해가 되지 않는 세계로 발을 들였을 가능성이 큽니다. 그들은 아름다운 테마 데모를 보고 제대로 작동하지 않을 때 좌절감을 느꼈습니다. 블록 편집기는 지식이 가장 부족한 사용자가 기본 이상의 레이아웃을 구축하기에 충분히 직관적이지 않았으며 지금도 마찬가지입니다.

나는 사용자가 이 간단한 책 판매 섹션을 구축하도록 안내하는 단계별 자습서를 선택했습니다. 그러나 문서화가 항상 최선의 답은 아닙니다. 사용자가 찾아 읽어도 결과가 항상 정확하지는 않습니다. 클릭했을 때 이 섹션을 편집기에 직접 삽입하는 버튼이 있으면 훨씬 더 간단했을 것입니다. 그런 다음 사용자는 콘텐츠에 맞게 사용자 정의할 수 있습니다.

그것이 블록 패턴이 들어오는 곳입니다.

테마 작성자는 사용자 정의 스타일을 사용하여 독특하고 복잡한 블록 조합을 구축할 수 있어야 합니다. 사용자는 데모처럼 보이게 할 수 있어야 합니다.

2005년 첫 WordPress 테마를 "빌드"(저는 이 용어를 느슨하게 사용)한 이후로 저는 이 문제에 대한 모든 방법을 보거나 시도했습니다. 페이지 템플릿. 테마 옵션. 단축 코드. 위젯. 원하는대로 말만 해. 그들은 모두 전에 시도되었습니다. 각 방법은 사용자에게 주요 장애물을 제공했습니다. 일부( ahem, shortcodes )는 사용자의 콘텐츠를 엉망으로 만들고 결국 테마에 묶이는 잠금 효과를 만들었습니다.

새로운 것에 대한 오랜 시간이 지났습니다.

블록 패턴이란 무엇이며 어떻게 사용자 경험을 개선합니까?

위 스크린샷과 같이 사용자가 여러 열의 가격 책정 옵션으로 레이아웃을 구축하려고 하면 어떻게 됩니까? 행운을 빕니다. 대부분은 블록 시스템으로 생산할 수 없었습니다. 블록 패턴이 없더라도 테마는 이를 가능하게 하기 위해 몇 가지 사용자 정의 블록 스타일이 필요합니다. 플러그인은 이러한 복잡한 출력의 공백을 채울 것이며 수년 동안 다양한 방식으로 가격 책정 테이블을 처리해 왔습니다. 테마 내에서 또는 훨씬 더 간단한 플러그인에서 이와 같은 레이아웃을 생성할 수 있다면 어떨까요?

블록 패턴으로 가능합니다.

간단히 말해서 블록 패턴은 블록의 그룹입니다. Core WordPress, 테마 및 플러그인은 미리 정의된 설정이 첨부된 패턴을 등록할 수 있습니다.

일반 사용자의 관점에서 블록 패턴은 레이아웃을 만드는 데 사용할 수 있는 미리 정의된 섹션입니다. 이러한 레이아웃은 이 기사의 앞부분에서 더 복잡한 가격 열에 이르는 책 섹션만큼 간단할 수 있습니다. 이러한 패턴을 사용할 수 있으므로 사용자는 버튼 클릭으로 복잡한 레이아웃을 만들 수 있습니다.

블록 시스템은 우리가 수년에 걸쳐 경험한 것과는 훨씬 다르고 미래와 호환되는 미래를 위한 토대를 마련했습니다. 결국 대부분의 블록은 그저 오래된 HTML일 뿐입니다. 블록 패턴은 이러한 블록 그룹의 등록에 불과합니다. 사용자가 테마를 전환하면 새 테마가 동일한 패턴을 등록하지 않더라도 콘텐츠는 그대로 유지됩니다.

Gutenberg 플러그인 버전 7.7은 패턴에 대한 인터페이스의 첫 번째 반복을 제공했습니다. 이것은 기본적이며 프로덕션에서 사용할 준비가 되기 전에 몇 번 더 반복됩니다. 결국에는 여러 패턴 중에서 선택할 수 있는 완전히 통합된 인터페이스가 제공될 것입니다. 사용자는 사용하고 싶은 것을 봅니다. 그들은 그 패턴을 클릭합니다. 포스트에 삽입됩니다.

더 이상 복잡한 테마 옵션이 없습니다. 더 이상 단축 코드 수프가 없습니다. 세심하게 제작된 테마 데모에 표시된 사용자 정의 첫 페이지를 만들 수 없는 이유를 궁금해하며 더 이상 몇 시간 동안 좌절할 필요가 없습니다.

제가 좀 낙관적일 수도 있습니다. 블록 패턴은 테마 및 플러그인 개발자 커뮤니티의 대규모 구매가 필요합니다. 핵심 WordPress는 기본적으로 몇 가지 인기 있는 패턴을 제공하지만 테마 작성자가 예술적 기술을 사용할 때 가능한 디자인의 폭을 커버하지는 않습니다.

저는 항상 블록 편집기에 대해 흥분했습니다. 그러나 항상 최종 제품보다 잠재력 에 더 흥분되는 것처럼 느껴졌습니다. 나는 그것이 내가 할 수 있다고 생각한 것이 되기를 끊임없이 기다리는 상태에 있었다. 네, 아직 기다리고 있습니다. 그러나 패턴 시스템의 초기 버전을 만지작거리다 보면 에디터가 우리에게 허용해야 했던 멋진 일을 할 수 있는 지점에 도달한 것처럼 느껴집니다. 오랜 기다림이 있었고, 아직 조금 남았습니다. 하지만, 지금까지의 작업을 경험하고 나서 다시 프로젝트에 대한 열정이 생겼습니다.