明るいモード：鮮やかな色、パターン、カスタムブロックスタイルを備えた新しいブロックテーマ

公開: 2022-07-21

StudioPressの創設者でGenesisFrameworkの共同作成者であるBrianGardnerは、BrightModeというディレクトリに新しいブロックテーマを持っています。テーマは、上品なグラデーション、14の美しくデザインされたブロックパターン、カスタムブロックスタイルに組み込まれた非常に多くの楽しいバリエーションを備えた鮮やかなカラーパレットを備えています。

パターンとテンプレートにより、ほぼすべてのユースケースに対応できる柔軟性が得られるため、多くのブロックテーマのニッチを特定することは困難です。ブライトモードはこのカテゴリに分類されます。これは、ビジネスまたは個人のWebサイト、ブログ、またはポートフォリオとして簡単に使用できます。

よく見ると、ガードナーのトレードマークのスタイルの微妙なヒントを見ることができます。タイポグラフィと間隔に細心の注意を払った、率直でミニマリストです。色は明るいですが、調和がとれていてバランスが取れているため、プロのコンテキストでの使用を妨げることはありません。

ガードナーは、すべてが始まったばかりのWordPressテーマの初期から、OGテーマの作成者の1人として独自の視点を持っています。彼は、Revolutionテーマで商用テーマのエコシステムの開始を支援し、同じ先駆的な精神をブロックテーマの新しい世界にもたらし続けています。

「昨年の夏、私はジャスティン・タッドロックが書いたブロックパターンとパターンディレクトリ（当時はベータ版でした）に関する記事を読みました」とガードナー氏は述べています。「彼はそれにリンクしていて、私は数分間クリックして過ごしました。最後に、かっこいいと思ったパターンを見て、「パターンをコピー」ボタンをクリックしました。これがどのように機能するかを確認したかったので、ブログに投稿を開いてコードを貼り付けました。出来上がり、ありました。その瞬間、私は知っていました。現代のWordPressの可能性が目の前に浮かびました。」

ガードナーの新しいテーマは、パターンを使用して、デモに表示されるすべてのセクションを定義します。ブライトモードは、見出し、テキスト、ボタンのあるカバー画像、複数の証言、さまざまなクエリレイアウト、複数のフッターとヘッダーのデザインなど、ユーザーがサイトに挿入できるさまざまなパターンを提供します。デモを表示して、サンプルコンテンツでそれらすべてが実際に動作していることを確認してください。

ガードナーは現在、ブライトモードのコレクションに追加するパターンをさらに構築しています。次に来る可能性が高いのは、ヒーローセクション、注目のボックス、召喚状、リンクページ、ポートフォリオパターンであると彼は言いました。

「ブライトモードの設計を数か月繰り返していたので、2つのことを達成する必要があると感じました。それを出荷することと、さらに追加するための扉を開いたままにすることです」とガードナー氏は述べています。

ブライトモードを最初にインストールして[カスタマイズ]をクリックすると、デモのようには見えません。ユーザーは、スクリーンショットに近づけるためにパターンを挿入する必要があります。デモに合わせてデフォルトでホームページにパターンを挿入することについてガードナーに尋ねたところ、将来のアップデートの可能性があるとのことでした。

「デフォルトでパターンを挿入することに関して、役に立つかもしれない唯一の例は、単なるウェルカムパターンであるブライトモードのホームページと、その下のグリッドループです」と彼は言いました。「もちろん、パターンを追加すると、これは更新の一部になる可能性があります。」

このテーマのユニークな機能の1つは、Headingsブロックに、テキストのさまざまなカラーグラデーションを作成する一連の楽しいブロックスタイルがあることです。

「このテーマのデザインでは、アクセシビリティと色のコントラストが最も重要でした。そのため、[色]ページを作成することもできました」とガードナー氏は述べています。彼は、新しくリリースされたFSEテーマの多くが色に対して意図的なアプローチをとっていないことを考えると、より多くのテーマ作成者に色を検討するように促すことを目指しています。ガードナーは、テーマ全体でさまざまなブロックスタイルで使用される一次、二次、三次色のセットを特定しました。

「一次、二次、三次色は、WCAG 2.0レベルAAとWCAGレベルAAAの両方のコントラストテストに合格します。通常のテキスト、大きなテキスト、グラフィカルオブジェクト、およびユーザーインターフェイスコンポーネントです」とガードナー氏は述べています。

スタイルガイドを表示すると、ボタン、引用符、ソーシャルアイコンに適用されている色を確認できます。

ブライトモードは、Quotesブロック内に複数の異なるスタイルオプションを提供します。それらは無地であるか、色付きの背景またはグラデーションの背景を持つことができます。背景のない引用には、カラーグラデーションの下線を適用することもできます。これの良いところは、これは引用符ごとに変更でき、各ブロック引用符で同じである必要はないということです。ユーザーは、さまざまなデザインで見積もりをカスタマイズすることを非常に楽しむことができます。それらのいくつかを下に示します。サイト全体で控えめに使用すると、非常に印象的です。

ガードナーがテーマについて最も気に入っていると述べたブライトモードの側面の1つは、カバーブロックが単一ページで使用される方法です。注目の画像をCoverブロックに取り込み、シャドウ用のカスタムブロックスタイルとフルハイトオプションも提供します。（フォールバックは、タイトルが付いた単なる黒いヘッダーです）。「これは、現代のWordPressで可能なことを実際に示しているように感じます」とGardner氏は述べています。

テーマをテストした後、ブロックスタイルで明らかにする隠された宝石の数と、ユーザーがあらゆる側面でどれだけのクリエイティブコントロールを持っているかに驚きました。私が変更する唯一のことは、ホームページがデモに似ていることを確認することです。これにより、ユーザーは、デモを再現するためにパターンを探し回る必要がなく、しっかりとした出発点があると感じることができます。ガードナーには、見た目に美しいパターンを作成する才能があります。この場合、彼が計画しているより多様なセット（ポートフォリオ、召喚状など）により、ブライトモードをより多くのコンテキストで使用できるようになります。

多くの従来のテーマ作成者は、テーマディレクトリでの可視性を高めるためにテーマをブロックすることに抵抗を持っていますが、ガードナーはWP Engineで開発者アドボケイトとして日雇いの仕事をすることができ、コミュニティとの関わりとユーザーの移行を支援するために報酬を受け取ります。ブロックエディタとフルサイト編集。

「本質的に、グーテンベルクの開発と歩調を合わせることと、WordPressの新機能は、私が報酬を得ていることです」とガードナー氏は述べています。「当然のことながら、これにより、（Frostの場合と同様に）テーマを簡単に試したり、新しく立ち上げたBuildersサイトなどのリソースを利用したりすることができます。それに加えて、私は自由な時間を夜と週末に深く掘り下げて、物事を創造的にどこまで進めることができるかを調べています。」

ブライトモードは、ブロックテーマで何が可能かを彼が個人的に調査した結果です。 WordPress.orgまたは管理者内のテーマインストール画面から無料で入手できます。テーマの今後の更新では、さらに多くのパターン、テンプレート、およびバリエーションが作成される予定です。ブライトモードは、ディレクトリの最初の100ブロックテーマの1つであり、WordPress.orgが本日通過したマイルストーンです。