特殊タグを使用したデザインの紹介 作：SunGenuin(佐藤)
'24/7/17時点で有志の方が運営していたジェネレーターにアクセスできないことを確認しました。
管理されているXのアカウントにも動きが無いようなので、運営を停止したと思われます。
22日に当方で開発したジェネレーターを全体公開にしましたので、よければ代打としてご利用いただければと思います。
こちら→「TxH-G」
解説記事はまた別途アップしますが、難しい操作はないので初見でも動かせると思います。
執筆のお役に立てたら幸いです。
-----------
前回投稿時にご紹介した、有志の方が運営しているジェネレーターを試してみました。
※'24/7/22追記あり※『ジェネレーター』試してみました
前回投稿時の「あとがき」にてご紹介した、ハーメルンの特殊タグ対応ジェネレーター『Z/Generator』を実際に使用し、生成される特殊タグの内容を解説します。
こちらの記事を作成するにあたり、ジェネレーターを開発された方にはご許可頂いております。
当該ジェネレーターへは上記リンクからアクセスできますので、ぜひお試しください。
今回の紹介にあたり、ジェネレーターの操作方法の詳細などについてはご説明いたしません。
あらかじめご了承ください。
といっても、操作自体に難しいところはなく、比較的簡素、かつ、スマートフォン等を使用しているユーザーが初見でも操作可能かと思います。
もし操作する際に不明点があれば、ジェネレーターの開発者様にお問い合わせください。
それではご紹介に移ります。
①ジェネレーター：Z/Generatorとは
有志の方により開発・運営されている非公式サイトです。
小説投稿サイト『ハーメルン』で使用可能な特殊タグに対応したジェネレーターが提供されています。
非公式であるため、すべての特殊タグに対応しているわけではないようです。
詳細や操作方法は、当該サイトの『概要』『使い方』にてご確認ください。
こちらの開発者様より、当ページでご紹介しているデザインをいくつかベースに開発したとご連絡頂いたため、今回こうしてご紹介記事を作成させて頂きました。
ハーメルンの特殊タグは誰でも構成内容を確認できることもあり、多くの方々が先駆者の作品等をベースに発展させたり、新規作成してそれをまた別の誰かが発展させたり、とにかくユーザー同士が影響し合って生まれた文化だと思います。
当ページでご紹介しているデザインも、これまでいろんな方が試行錯誤して生み出したものをベースに、紹介者である私自身にとって使いやすいようカスタマイズしたものです。
ですので、当ページを参考にした、と開発者様には言って頂きましたが、私個人では無く、これまでのハーメルンの特殊タグ文化をベースに作り出されたジェネレーターであると私自身は認識しております。
以降は、冒頭の通り『小説投稿サイト『ハーメルン』で使用可能な特殊タグに対応』と表記させて頂きます。
②Z/Generatorで生成できるもの
現在のジェネレーターで作成できるものは大まかに2つです。
・SNS風のデザイン/匿名メッセージサービス風のデザイン/大百科風のデザイン、と言った1対多のコミュニケーション用サービスやコミュニティサービス関連のデザイン生成
・LINE風のデザイン/掲示板風のデザイン、と言った1対1、多対多のコミュニケーション用サービスなどのデザイン生成
特に後者のうち「掲示板風のデザイン」の生成方法は私にとって使いやすいものでした。
その理由について、次で解説します。
③投稿フォーム有りで1レスごとの投稿ができる！掲示板風のデザイン
ハーメルン内には「掲示板形式テンプレ」という形でもっともシンプルなデザインを少しの操作で出力可能な機能が標準装備されています。
開始番号や個数、IDを表示するか日時はどうするか、といった細かな設定もできますよね。
しかし、始めに個数を設定して一気にテンプレが出力される、という仕様。これが私には少し大変でした。
予想外にレス数が増えたときなどや固定IDを使用したいときなどは、コピー＆ペーストに時間が掛かったり、打ち間違えを起こしてしまったり、コピペをする際に誤って前後のタグを消してしまったり……些細なミスが気になってしまうのです。
当該ジェネレーターは、そういったミスをできるだけ減らすことができるのではないか、と期待を寄せています。
どういうことかと言うと、こちら、普通の匿名掲示板サイトのように『入力欄』と『投稿ボタン』が設置されており、1レスごとに打ち込んで生成することが可能なのです。
レス番号の入力欄や、投稿名の入力欄、IDのセレクトボックスも用意されており、投稿名やIDは全体のデフォルトや複数の選択肢を設定することもできます。
たとえば、
掲示板の投稿名のデフォルト名を「書き込むななし」にしたいときは、全体の「設定」メニューから『キー設定』の画面で登録することができます。投稿名、IDもカンマ(,)区切りで複数設定可能なので、途中で別の投稿名、たとえばコテハン等に切り替えて投稿することもできるのです。
いちいち前のレスからコピペする必要も無く、セレクトボックスからあらかじめ設定したものを選択するだけなので、個人的にここがいちばん便利に感じました。
さらに、『View』モードと『H-Code』モードのふたつの画面モードがあって、『View』モードではプレビュー画面のようにデザインを確認でき、『H-Code』モードでは特殊タグを確認できます。
以下の掲示板は実際にジェネレーターを使用して生成したものです。
1: デフォルトスレ主 ID:TESTid
こんな風に
2: デフォルト掲示板ななし ID:dgtn@Lw1ru
投稿可能です
投稿名もIDもあらかじめ設定したもの以外に
ランダム生成されたものを選択することも可能です
10: デフォルト掲示板ななし ID:wx31HRxj2Y
レス欄を操作して番号を変えることもできました
掲示板の構成内容としては、当ページの『特殊タグを使用したデザインの紹介：その1』にもある掲示板形式のデザインとほぼ同じですので、そちらも合わせてご確認ください。
③-2 特定掲示板を再現した別タイプの掲示板風デザイン
ジェネレーターで操作できる掲示板形式は、上記のシンプルなデザインのものから、「あにまん掲示板」という特定の掲示板サイトをベースに開発されたデザインもあるようです。
こちらは当ページではなく、別の方々の特殊タグをベースにされたそうなので、申し訳ないのですが構成内容の全容を把握しておりません。
また、元となった掲示板も触れたことがないため仕様を把握しきれておらず申し訳ないです。
ただ触ってみたところ、通常の掲示板形式と大きく異なる点は以下の通り。
・カテゴリが存在する掲示板サイトを模しているため、カテゴリ欄がある
・スレッドタイトルを表示させるための入力欄がある
・1度投稿したレスを後から削除できる(通常の掲示板形式ではできませんでした)
・内容を書きだして保存するボタンと、保存した内容を読込んで続きから操作できるようにするボタンがある
・IDがない(おそらく元となった掲示板の仕様)
・ハートマーク横の数字を操作することで投稿内容の大きさや色を変化させることができる
以下の掲示板は実際にジェネレーターを使用して生成したものです。
実際に試してみた結果 ☆り
:≫1:::二次元好きの匿名さん2X/XX/XX XX:XX:XX:♡ 0: :報告:
こんな感じです
:≫2:::二次元好きの匿名さん2X/XX/XX XX:XX:XX:♡ 12: :報告:
文字色変化
:≫3:::二次元好きの匿名さん2X/XX/XX XX:XX:XX:♡ 100: :報告:
数字は100まで設定できるようです
:≫5:::二次元好きの匿名さん2X/XX/XX XX:XX:XX:♡ 0: :報告:
↑実は4が消えています
行数がかなりありますね。
掲示板のタイトルを表現する際にかなり拘っているようです。
ジェネレーター内の「View」画面だと、各レスに『削除』ボタンが存在するのですが、コピペ後はなくなるようですね。
以前Twitter(現：X)風のデザインを紹介した際、各ボタンの再現をハーメルン内でのみ使用できるフォントで行いましたが、どうやらこの掲示板のデザインも同様のようで、ジェネレーター内の「View」と実際のデザインが一部異なるようです。
どう違うかは実際に動かして確認してみてください。
また、見たところ「あにまん掲示板」の部分は固定表示されているようですが、以下の通り、生成後にハーメルン内にコピペする際に内容を変えることもできるので、特定掲示板名を出さずに使用できると思います。
④より「それっぽく」なったLINE風デザイン
掲示板の他にも、いくつかのデザインを紹介します。
上記掲示板形式と同じタブ内で生成できる『LINE風のデザイン』ですが、正直、以前当ページで紹介したデザインよりもスッキリしていると思います。
実際に見て頂いた方が早いですね。
こちらの方がスマートな気がします
雰囲気は最近のLINEというよりちょっと前のデザイン感はありますが、以前紹介したものよりもより『LINEっぽい！』という感じになっている気がします。
こちらの『設定』画面で設定できるものは以下の通りです。
・タイトル名
・投稿者のセレクトボックスの選択肢
投稿者のデフォルト名は「あなた,相手」で2択のようです。
『あなた』を選択した状態で投稿した場合は緑の枠内に、『相手』を選択した状態で投稿した場合は白の枠内に表示されます。また、相手の名前も表示されます。
カンマ区切りにすれば選択肢はいくらでも増やせそうなので、グループを作ることも簡単そうです。
投稿画面には投稿者のセレクトボックス横に『既読』のチェックボックスがあります。
デフォルトではON(既読表示する)になっていますが、OFFにすれば未読状態が手軽に作れて、こう言った細かい部分のコピペがないだけで作業もずいぶん楽になりそうな気がしますね。
このLINE風画面では、上記でご紹介した『あにまん掲示板風』のデザイン同様、投稿を1つずつ削除可能です。
打ち間違えたとき等に便利そうですね。
⑤さまざまな特殊タグ！リアルタイムなプレビューで確認しやすい
続いてもっと軽微な特殊タグに紹介を移ります。
当ページでもご紹介したSNSや大百科風など、多くがベースになっているのでデザイン自体は既知のものが多いかもしれません。
しかし、今回最も重要視しているのは、その操作の簡素さです。
以下は、SNS風のデザインの中に匿名メッセージサービスを表示させているものです。
ユーザーネーム @test_ |
| こ | り | ♡ | ふ | め |
特殊タグを見ると、boxとtableで囲んだりさらにはハーメルン内のみのフォントを使用していたりと、使えば使うほど後からの手入れが大変そうな構成になっています。
ですがジェネレーター上では、以下のような構成で生成することができるのです。
<ツイッター>
<ユーザー名>ユーザーネーム</ユーザー名>
<アカウントID>@test_</アカウントID>
<ツイート内容>
<マシュマロ>ここに内容</マシュマロ>
</ツイート内容>
</ツイッター>
・ユーザー名で囲まれた範囲に入力すればそれがユーザー名となり
・アカウントIDで囲まれた範囲に入力すればそれがIDとなり
・ツイート内容で囲まれた範囲に入力すればそれがツイートの内容
になります。
しかも「View」でリアルタイムに変換して表示されるので、どの箇所のどんな内容にいま手をつけているのか、視覚的にわかりやすくなっていると思います。
たまに特殊タグを編集していてどこを操作しているのか分からなくなることがあるので、こういったときは非常に便利だなと感じました。
また、ジェネレーター内の入力ページには複数のボタンが設置されており、たとえば『マシュマロ』のボタンを押せば、
<マシュマロ></マシュマロ>
というジェネレーター内タグが入力欄に出力され、あとは範囲内に内容を書き込むだけで「H-Code」にハーメルン用の特殊タグに変換し出力してくれます。
本来は5行も必要な特殊タグがこの1行で済むので、パッと作りたい時や、スマートフォン等で執筆している時などで活用できそうです。
そのほかにも、ニコニコ大百科風もボタンひとつ押せば、
<ニコニコ>
<ニコタイトル></ニコタイトル>
<ニコフリガナ></ニコフリガナ>
<ニコ項目目次ヘッタ><ニコ項目目次></ニコ項目目次></ニコ項目目次フッタ>
<ニコ項目名></ニコ項目名>
<ニコ項目内容></ニコ項目内容>
</ニコニコ>
このようなジェネレーター内タグが出力され、それぞれの範囲内を埋めて行けば以下のような大百科が生成できる仕組みになっているようです。
ジェネレーター内タグを埋めた状態↓
<ニコニコ>
<ニコタイトル>たいとる</ニコタイトル>
<ニコフリガナ>タイトル</ニコフリガナ>
<ニコ項目目次ヘッタ>概要<ニコ項目目次></ニコ項目目次>次の目次とか</ニコ項目目次フッタ>
<ニコ項目名>概要</ニコ項目名>
<ニコ項目内容>でここに概要の内容とか</ニコ項目内容>
<ニコ項目名>次の目次とか</ニコ項目名>
<ニコ項目内容>項目ごとの内容を追加するのも容易です</ニコ項目内容>
</ニコニコ>
ハーメルン用の特殊タグに変換されたもの↓
| ニコニコ大百科 | け
|
| い88 |
| お114514 |
| い いいね！ |
| お ナニニ優しく応援 |
| す 記事編集 |
■ 概要
でここに概要の内容とか
■ 次の目次とか
項目ごとの内容を追加するのも容易です
boxやtableやその他特殊タグが入り組んでいる状態から編集するよりは、ジェネレーター内タグで編集する方が行数が少なく、またリアルタイムでプレビューできるので確認しながら作業したい方にはおすすめです。
ハーメルンの執筆ページも大幅リニューアルされ、これまで以上に使いやすくなりました。
傍点やルビなどは範囲選択が利くようになってますます便利になり、特殊タグも呼び出しやすくなったと思います。
当該ジェネレーターはメインの執筆用というよりは、あくまでサポート役のような立ち位置で使用する方がより効果的なのではないでしょうか。
個人的にはスマートフォンでも掲示板風の執筆作業ができることに歓喜です。
あとは掲示板風にもスレッドタイトル付けられる機能や、上記のSNS風デザインのジェネレーター用タグを掲示板風デザインの中にも表示できるようになったらいいのにな……と思ったり。
ハーメルンでの執筆がより楽しく、便利になるよう開発してくださった有志の方々や、特殊タグのデザインを試行錯誤して開発しているユーザーの方々に感謝し、今回の締めとさせて頂こうと思います。
今回紹介したデザイン内の構成で気になる点があれば感想欄にお書きください。
お返事までに時間を頂く場合等もあるかもしれませんが、できるだけ返信します。
今後も引き続き特殊タグで再現したもの等をご紹介していく予定ですので、少しでも執筆の手助けになれたらと思います。
最後までお読み頂きありがとうございました！