WordPress 테마 작성자가 블록 패턴 게임을 강화할 때입니다.

이번 주 루틴을 진행하면서 최신 WordPress 테마 릴리스를 훑어보고 블록 편집기를 지원하는 새 프로젝트를 찾았습니다. 그것은 심지어 몇 가지 사용자 정의 패턴을 제공했습니다. 디자인은 특별하지 않았지만 전체적으로 확고한 주제였습니다. 그러나 오늘의 더 나은 부분을 그것에 대해 쓰고 난 후에 나는 이야기를 계속 진행할 수 있다고 생각하지 않았습니다. 문제가 발생했습니다.

그것은 내가 최근에 다른 여러 사람들과 느꼈던 것과 같은 것이었다. 놓친 기회가 너무 많았다. 그 주제는 그 이상을 가능하게 하는 토대, 근본적인 잠재력을 가지고 있었습니다.

테마에는 사용자가 구매할 수 있는 상업용 "프로" 버전이 있었습니다. 그러나 거의 모든 프로 기능은 추가 테마 옵션을 상향 판매하는 구식 전술에 의존했습니다. 한 가지 예외는 올해 말 WordPress와 함께 제공될 전역 스타일 구성 요소의 일부로 무료로 제공될 블록 관련 기능이었습니다.

사용자 정의 블록 스타일은 어디에 있습니까? 사용자는 어디에서 고유한 패턴을 발견할 수 있습니까? 추가 탐색 메뉴, 사이드바, 색상 설정 및 타이포그래피 옵션은 최종 사용자에게 점점 더 가치를 더해주는 요소가 되고 있습니다. 지금 당장은 안전한 돈일 것이고, 너무 많은 위험을 감수하지 않는 것의 편안함을 이해할 수 있습니다.

테마 작성자는 변속을 시작해야 합니다. 상향 판매는 재고 WordPress에서 사용할 수 없는 기능의 형태로 제공되어야 합니다. 바로 지금, 그것은 독특한 블록 패턴과 스타일을 구축하는 것을 의미합니다.

패턴 아이디어 탐색

지난 달, 나는 커스텀 패턴을 만지작거렸다. 10년 넘게 디자인 및 개발 사업을 하는 동안 사용자 정의 코드를 사용하지 않고 블록 편집기만으로 달성할 수 있었던 것은 다방면에 걸친 블록 준비 테마에 불과했습니다. 우리는 WordPress 커뮤니티에 훨씬 더 나은 재능을 가지고 있으며 그들의 예술성이 발휘되는 것을 보고 싶습니다.

이 모든 것은 WP Tavern Jukebox 팟캐스트로 시작되었습니다. 에피소드 #1과 #2를 아직 듣지 못했다면 확인해야 합니다. 새로운 호스트인 Nathan Wrigley는 자신이 필요로 하는 몇 가지 기능을 구현하기 위해 디자인 및 개발 캡을 다시 착용하도록 저를 밀어주었습니다. 몇 년 동안 나는 팟캐스팅이나 어떤 종류의 오디오도 많이 다루지 않았습니다. 이것은 저에게 새로운 영역이었습니다. 궁극적으로 팟캐스트는 오디오 패턴에 대해 생각하도록 영감을 주었습니다.

오늘날 WordPress의 편집기로 무엇을 할 수 있습니까?

나는 현대적인 오디오 프리젠테이션을 찾기 위해 다양한 레이아웃을 위해 웹을 샅샅이 뒤졌습니다. 최종 사용자가 편집기만으로는 수많은 개념을 구현하는 것이 불가능했습니다. 테마 자체의 광범위한 사용자 정의 블록 스타일이 필요합니다. 그리고 전혀 할 수 없다고 생각했던 여러 디자인이 있었지만 일반적으로 플러그인 영역 요소가 있었습니다.

그러나 실행하고 나만의 아이디어를 만들 수 있는 아이디어를 찾았습니다. 나는 Martian 사운드트랙의 간단한 오디오 파일로 시작했습니다. 전날 밤에 영화를 다시 보았고 David Bowie 킥을 하고 있었습니다.

간단했다. 그룹, 열, 이미지, 단락, 제목, 오디오 및 소셜 아이콘 블록을 추가하기만 하면 됩니다. 나는 결과에 만족했고 일부 트위터 팔로워들은 긍정적인 반응을 보였다.

지원에서 영감을 받아 대체 레이아웃을 만들었습니다. 표지, 단락, 제목, 오디오 및 소셜 아이콘 블록을 추가하여 훨씬 더 간단해졌습니다.

원래 패턴을 기반으로 오디오 블록 대신 SoundCloud 내장을 사용하는 패턴을 만들었습니다. 나는 또한 팟캐스터를 위한 약간의 변경으로 또 다른 것을 만들었습니다.

이 프로젝트에 대해 더 깊이 파고들수록 레이아웃을 만드는 데 더 능숙해졌습니다. 나는 몇 가지 제한 사항이 무엇인지 이해하고 주변의 모든 것을 결합하기 시작했습니다.

편집기에서 가장 문제가 되는 영역 중 하나는 충분한 간격 제어를 넘겨주지 않는다는 것입니다. 따라서 픽셀 단위에 의존하고 마크업에 추가 <div> 를 추가하기 때문에 사용하지 않는 것을 선호하는 Spacer 블록을 자유롭게 사용해야 했습니다. 몇 가지 패턴을 만들려면 순수주의자가 되어 사용 가능한 도구를 사용해야 했습니다.

이러한 사고방식의 변화는 더 많은 가능성을 열어주었습니다. 오디오 관련 블록 패턴을 몇 개 더 만들었습니다. 다시 말하지만 레이아웃은 단순했지만 최종 사용자가 추가할 수 있는 이미지로 시각적으로 눈에 띄게 만들고 싶었습니다. 목표는 사용자가 미리 디자인된 섹션에 클릭 한 번으로 액세스할 수 있도록 하여 사람들이 자신의 창의성을 보여줄 수 있는 출발점을 제공하는 것입니다.

다음 단계는 오디오 패턴 이상으로 생각하기 시작하는 것이었습니다. 그 공간에서 다른 사람들이 할 수 있는 일은 훨씬 더 많습니다. 조금 더 모험을 하고 싶었다.

이후에 Tavern에서 사용하고 싶은 다음과 같은 뉴스 유형의 기사 헤더와 같은 몇 가지 다른 패턴을 만들었습니다.

더 많은 개념을 공유할 수 있지만 여기가 이상적인 장소인 것 같습니다. 목표는 패턴 포트폴리오를 보여주는 것이 아닙니다. 우리의 테마 디자인 커뮤니티가 훨씬 더 나은 것을 만들 수 있기를 바라는 마음에서 영감을 주기 위한 것입니다. 나는 또한 몇 가지 패턴을 팝업하는 것이 얼마나 쉬운지 보여주고 싶었습니다. 몇 시간의 개발 시간 대신 많은 아이디어가 단 몇 분으로 단축되었습니다. 그것이 오늘날 블록 시스템이 제공하는 힘입니다.

내가 1월에 테마 작가를 위한 상업적 기회를 만드는 블록 시스템에 대해 썼을 때, 그것은 이론적인 포스트였습니다. 이것은 조금 더 연습을 하는 후속 조치입니다(물론 실제 판매는 제외).

테마 회사로서 음악가를 위한 프리미엄 테마를 구축하고 있다고 상상해 보십시오. 사용자가 선택할 수 있는 몇 가지 기본 패턴을 포함할 수 있습니다. 그러나 프로 패키지의 일부로 제공할 수 있는 대안은 무한합니다.

나는 이미 수백 개의 패턴을 갖게 될 다목적 테마 개념을 염두에 두고 있는 테마 작성자/회사가 있다고 확신합니다. 나는 그들이 견고한 분류 시스템을 갖거나 별도의 패키지 또는 수입품을 제공하기를 바랄 뿐입니다.

블록 패턴 디렉토리는 WordPress 5.8과 함께 출시될 예정입니다. 처음에는 주로 핵심 패턴이 됩니다. 그러나 다른 사람들은 시간이 지남에 따라 기여하도록 권장됩니다. 이것은 플랫폼에 대한 환영 기능이지만 모든 테마 디자인과 완벽하게 일치하지는 않습니다. 각 테마에는 고유한 디자인 뉘앙스가 있습니다. 각자 문제 해결 방법이 다릅니다.

최고의 패턴은 특히 테마 경험의 일부로 패키지 및 마케팅되는 사용자 정의 블록 스타일과 결합될 때 테마 작성자 자신에게서 나옵니다. 개발자는 전체 시장이 따라잡을 때까지 기다리거나 게임보다 앞서 나갈 수 있습니다.