WordPressテーマSWELLのリッチカラムと制御カラムで遊んでみた

タイトル通り、WordPressテーマ、SWELLをver.2.5.1にアップデートしましたので、リッチカラムと制御カラム、そして画像のlightbox機能のon・offで遊んでみています。

りさ

この記事に掲載されているサンプル画像は、私がRPGツクールMZで作成している🎮ゲームに使われているものであったり、ツイッター上に載せた落書きになります。

目次

SWELLのリッチカラム

ユキちゃんドット絵正面アニメーション
ユキちゃんドット絵正面アニメーション
ユキちゃんドット絵正面アニメーション
ユキちゃんドット絵正面アニメーション
ユキちゃんドット絵正面アニメーション
ユキちゃんドット絵正面アニメーション
ユキちゃんドット絵正面アニメーション
ユキちゃんドット絵正面アニメーション

上のユキちゃんの2つ目以降のドット絵には、デュオトーンフィルターを使用しています。

ユキちゃんのドット絵のカラム表示方法

  • PC…8カラム
  • タブレット&スマートフォン…4カラム

サイト全体でクリックorタップしても画像が拡大できる、lightboxの機能はオフになっていますが、
下のおでこに赤色のなにかがついてるロン毛タレ目くんと、ロゴにはオンにしています。

Diago_Mulberry2021
左カラム60%右カラム40%

PCでキレイに上下を揃えたいときは画像や、ボックスを上手く使うと良さそうですね。

ちょっとした落書きを貼るにもキレイにレイアウトができますね。

クオルの研究所のロゴ

3つ目、このカラムを幅100%にしています。まさにリッチ。デザインの自由度が高まりますね。

キャラ絵+文章+ロゴのカラム表示方法

  • PC&タブレット…2カラム
  • スマートフォン…1カラム

リッチカラムや制御ブロックを使って面白そうだ!と思った使い方

やってみたいと思ったな~!という、思いつきです。

縦読み系漫画サイト

アメコミのような、左から右へ読むマンガをスマートフォンで読みやすく1カラム表示すれば、縦読み系マンガサイトとかも簡単にできそうですね。

紙のように見開いて読みたいと思う方も多いですが、ウェブトゥーン式の漫画も中々読みやすくておすすめです。

りさ

うちのサイトは残念ながら、1コマ1コマ切り抜いて掲載していないです…。ただ、昨年のクリスマスマンガは、スマホでも見やすいようなコマ割りを意識しました。

作成するのにやや意識して作らないといけないのは、極端な特殊なコマや、変形コマは断固NGというところでしょうか。

でも、もともと紙でしか楽しんだことがない方には、マンガ=1ページ構成で考えるという概念を破壊することができるので、やってみると面白いかもしれないなという感想です。

同時に紙としても公開する予定があるものであれば、読み手は両方楽しめますね。

ゲームで例えるなら、画面に映るゲームを遊ぶ=PC or コンシューマのみ。
という考えは私の中では約15年前、見事モバゲーに打破されました。

中でも「ザ・デップショー デプリンピック」、「鬼嫁スウィング」は2分以内で遊べるゲームなんですけど、動く絵やボタンをタイミングよく押したときに見れるアクションが見たくて遊んだゲームかも知れません。友達とスコア競ってたのが懐かしい分思い出補正もありますが、今でも面白いなーーーっと。思い出したらつい遊んじゃいます。

①ザ・デップショー デプリンピックは、広告ブロッカーなどの拡張機能を備えたブラウザでは遊べませんので解除するか、ゲストモードで遊びましょう。
②鬼嫁スウィングは、PCで遊ぶ場合、※1デベロッパーツールなどでタッチデバイス化させて、遊べます。
※1 デベロッパーツールの起動方法はブラウザによって違いますので操作方法は割愛いたします。

俗に「エロフラ」とかもそうですが、タッチorクリックのみで遊べるゲーム作りを考えた神々は素晴らしい。

話を元に戻すと、この縦読み系漫画サイトを1人で作ろう!と思うとかなり工程数が多くなるので、おすすめできません

理由として、自分の描いたマンガのコマを全部切って納品する仕事を前に受けたことがあったんですが、根気強くやらないとしんどいんですね💦

自分で草案を練っておいてアレですが、「描き上げるのもやっとのことなのに、更にコマの切り抜きが加わると…自分の性格ではしんどいっす。あ!でも、その分の作業代を加算してお代金を頂けるなら…やりますよ」という思い出からの、矛盾が生まれました。

よって、この内容はWEBディレクターさん向けですね☺

期限付き広告に◎

クリックorタップで拡大します。

表示期間を設けることができるのでお店を持つ人は、メインのページを手間なく期間限定のメニューを公開してみたり、イベント限定メニューなどを並べることができますね。

会社に勤めていたときに行っていたんですが、この作業、地味に面倒くさいんですよね。
しかし制御ブロックによって、よりカスタマイズされた拡張が可能なので再利用ブロックと合わせて使ってみると本領を発揮しそうです。

社内の自作テーマに対して、すべてカスタムフィールドとかでキャンペーンの記入をやってたので、嬉しい機能ですね。

メルマガor支援者サービスに登録してくれた方専用のサービスにも◎

クリックorタップで拡大します。

購読者専用のサービスとしての機能が充実しそうです。

因みに、このブログでも今年の末に実装して行こうと思っています。マルチに動くのが苦手なので…あくまでも吟味している段階です。

実装するのであれば、WordPressの都合上、完全匿名で読者登録をしてもらうということは不可能ですので、運営者側が購読者様のメールアドレスを管理する旨の利用規約を更新せねばいけませんね。

そして支援者サービスの場合、Ci-enと並行して使っていこうと思っています。

SWELLを購入してよかったこと

今後増えていくかと思いますが、現段階でSWELLにしてよかったことを書き出ししてみます。

  • 開発者さんのお知らせを直接受け取れる、Slackへの参加ができること
  • 軽い上にデフォルトで使っても十分にオシャレ
  • カスタマイズがめんどくさくない。ちょっとしたCSSの編集も簡単。
    • プラグインを使えばバックアップも簡単に取れるので更に◎
  • アップデート内容がかなり豪華
  • サイトの更新や、新規サイトを作る手間が減ったこと
  • SimplicityCocoonの開発者さん、わいひらさんに間接的に貢献できている感があること…!

これからもアップデートを楽しみにしてます…!

URLをコピーする
URLをコピーしました!

コメント

コメントする

目次
閉じる