JIN:Rオリジナルのブロックエディター機能｜初心者必見の活用術
くら
ワー研
JIN:RのDEMOデザイン｜特徴と実際の使用例を紹介します
くら
記事内に商品プロモーションを含む場合があります
JIN:Rには、あらかじめ用意されているDEMOデザインを自分のサイトへ反映できる機能があります（デザインプリセット機能）。
用意されているDEMOデザインは全部で23種類。
この記事では、JIN:Rで使える23種類のDEMOデザインの特徴や、実際に使用してみた例を紹介しております。
どんなDEMOデザインが用意されているか、どのくらい簡単に操作できるのかがわかるような内容になっております。
DEMOデザインを使用すれば、
- ブログ立ち上げ後、すぐに整ったサイトデザインにできる
- 記事執筆に集中できる
- ワンクリックでだれでも簡単に適用できる
上記のようなメリットがあります。
JIN:RはIT未経験者、ブログ初心者でも簡単に扱えます！
この記事でわかること
- 23種類あるDEMOデザインの特徴
- 実際にDEMOデザインを使用した例
（デザインプリセットのカスタマイズ方法） - DEMOデザインを使用するメリット・デメリット
ブログ初心者におすすめしたい
WordPressテーマ「JIN:R」
- 柔らかでおしゃれなサイトを１クリックで作れる！
- 初心者でも直感的に扱える！
- マニュアルとサポートが充実している！
- 【参加費永年無料】購入者限定のブログコミュニティに参加できる！
レンタルサーバー「ConoHa WING」とセットで購入すると1000円OFFで契約できますよ！
購入方法、導入方法を以下で解説しているので、あわせてご参考ください。
あわせて読みたい
JIN:Rの購入・インストール方法【安く購入する方法も伝授します】
Contents
23種類あるDEMOデザインの特徴を解説！
それでは早速、JIN:Rで用意されているDEMOデザインをご紹介しますね。
DEMOデザインは大きく分けて３つあります。
- そのまま使えるデザイン（8種類）
- コンセプト重視のデザイン（12種類）
- 企業サイト向けのホームページのデザイン（3種類）
順にご紹介します。
そのまま使えるデザイン（8種類）
おすすめな人
- シンプルなデザインが好きな人
- サイトデザインに時間をかけたくない人
- 記事執筆に集中したい人
このDEMOデザインは情報がわかりやすく整理されており、シンプルで読みやすいサイトデザインとなっております。
どれもシンプルでそのまま使えるプリセットで、用意する画像もありません。
デザインの構成はどれも似たようなもので、色違いが8種類用意されていると考えてよいです。
用意する画像もないので、適用すればそのまま使える！
色ごとに特徴をまとめてみた
- Milk Chocolate
- ナチュラルで相手に安心感を与える「茶色」を基調としたデザイン
- チョコレート、大地、紅茶、木材などが連想できる
- Cuty Pink
- 気持ちを優しくし穏やかにする「ピンク」を基調としており、主に女性をターゲットとしたデザイン
- 女性、母、桜、美容などが連想できる
- Healing Green
- 明るく元気なイメージを持つ「黄色」を基調としたデザイン
- 太陽、電気、ひまわりなどが連想できる
- Toy Yellow
- 自然や環境などをイメージできる「緑」を基調としており、相手に安心感と穏やかな気持ちを与えるデザイン
- 森林、植物、アウトドアなどが連想できる
- sky blue
- 明るく開放感のある「水色」を基調としたデザイン
- 旅行、空、飛行機、海などが連想できる
- Ocean blue
- 深い「青」を基調としており、信頼性や堅実性を与えるデザイン
- 誠実性、冷静、堅実性を感じられる
- Egyption Green
- 深い緑色を基調としており、安心感ときっちりしたイメージを与えるデザイン
- 安心感、穏やかさを感じられる
- Navy Blue
- 誠実で上品なイメージを与える「紺色」を基調としたデザイン
- 知的で専門性のある雰囲気を感じられる
色は自分の好みで決めるか、扱うジャンルのテーマやターゲットによって選ぶのがおすすめです。
コンセプト重視のプリセット
おすすめな人
- より個性的なサイトデザインにしたい人
- ブログのコンセプトをわかりやすく伝えたい人
上記のDEMOデザインはコンセプトを重視したプリセットです。
情報がわかりやすく整理されているだけでなく、見た目を魅力的に伝えて印象に残るようなデザインとなっております。
トップページから読者にブログのコンセプトを伝えたいときやインパクトを与えたいときに使えます。
以下より、各デザインの特徴を簡単にまとめました。
ご参考にどうぞ！
Cuteのデザイン特徴
- 気持ちを優しくし穏やかにする「ピンク」を基調としたデザイン
- 穏やかで柔らかなデザイン、女性に好まれやすい雰囲気がある
ジャンル：
美容系
（コスメティック、スキンケアなど）
Resortのデザイン特徴
- 信頼性・誠実性を表す「青」を基調としたデザイン
- 明るく解放感があるデザイン
- ブログコンセプトを読者に伝えやすい構成
ジャンル：
旅行系
（クレジットカード・観光情報など）
Natureのデザイン特徴
- 安心感と穏やかさを与える「緑」を基調としたデザイン
- 自然や健康をイメージできるような雰囲気
ジャンル：
アウトドア・健康系
（キャンプ・健康食品など）
Minimalのデザイン特徴
- 清潔感やシンプルさがある「白」を基調としたデザイン
- 装飾は控えめで、サイト全体的に余白を取って配置しているため、すっきりして読みやすい印象がある
ジャンル：
日用品・ガジェット系
（PC、カメラ、文房具など）
Aromaのデザイン特徴
- ナチュラルで優しい雰囲気のあるデザイン
- 全体的に落ち着いた色で構成されている
ジャンル：
日常品系
（アロマ、植物など）
Brandingのデザイン特徴
- 女性に好まれやすい「ピンク」を基調にしたデザイン
- 可愛さもありつつ、大人っぽい雰囲気があるデザイン
ジャンル：
キャリア系（女性ターゲット）
Classicalのデザイン特徴
- 堅苦しくなく、かつ柔らかすぎない雰囲気のあるデザイン
- 「青」を基調としたデザインなので、堅実で信頼感がある
ジャンル：
ブログ・ガジェット
Dark modeのデザイン特徴
- クールで先進的な雰囲気のあるデザイン
- 暗く男性的で高級感があり、使うだけで権威性が感じられるようなデザイン
ジャンル：
ブログ・ガジェット系
（男性ターゲット）
Sportyのデザイン特徴
- 明るく活発なイメージがある「黄色」を基調としたデザイン
- サイト全体的に明るく活発な雰囲気がある
ジャンル：
スポーツ系
Nomadのデザイン特徴
- 全体的に落ち着いた、大人の男性のイメージがあるデザイン
- ダークグリーンをメインカラーとしており、大人っぽい高級感が感じられる
ジャンル：
起業・副業系
Portfolioのデザイン特徴
- 「白」や「ピンク」など優しい色を使用した、全体的に柔らかで優しいデザイン
- キュートで可愛らしい雰囲気がある
- 画像スライドショーを使用して、「どんなデザインを描いてくれるのか」を伝えている
ジャンル：
アーティスト系
Youtuberのデザイン特徴
- 「黒」と「青」を中心とした、信頼性と高級感のあるデザイン
- 動画スライドショーを使用して動きのある背景を取り入れることで、先進的な印象を作っている
ジャンル：
ゲーム・アーティスト系
企業サイト向けのホームページのプリセット（3種類）
おすすめな人
- ポートフォリオを作りたい人
- 企業向けホームページを作りたい人
上記のDEMOデザインは「企業サイト向けホームページ」のプリセットです。
企業サイトだけでなく、ポートフォリオとしても活用ができるデザインとなっております。
企業サイト向けとは書いてありますが、カスタマイズしてブログ向けのサイトデザインに変更することは可能！
以下より、各デザインの特徴を簡単に解説します。
Coffeeのデザイン特徴
- コーヒー色を基調としたナチュラルな印象があるデザイン
- 主に通信販売を中心として作られた構成
ジャンル：
通信販売（コーヒーなど）
Restaurantのデザイン特徴
- 何枚かの写真でお店の雰囲気を紹介し、メニューにある品をおいしそうに魅せている
- レストランの宣伝・予約を想定した構成
ジャンル：
飲食店などの店舗に関するホームページ
Formalのデザイン特徴
- 「緑」を基調としており、読んだ相手に安心感を与えるデザイン
- 法律事務所の予約を想定した構成
ジャンル：
法律事務所への相談・予約に関するホームページ
DEMOデザインを使用するメリット・デメリット
DEMOデザインを自分のサイトへ適用するメリット・デメリットをご紹介します。
デザインプリセットの最大の魅力は、１クリックで誰でも簡単に整ったサイトを作れるところ。
HTMLやCSSなどのプログラミング知識が無くても簡単にサイトをデザインできるので、IT未経験者でも簡単に扱えます。
しかし、JINR使用者と似たようなサイトデザインになるのがデメリット。
独自のデザインにしたいなら、デザインプリセット後に自分でカスタマイズする必要があります。
詳しくは、DEMOデザインを自分のサイトへ適用する方法（デザインプリセット機能）で解説しております。
デザインプリセット後のカスタマイズ方法も解説しています！
【実際に使用してみた】DEMOデザインを自分のサイトへ反映してみた
冒頭から「JIN:Rは１クリックでおしゃれなサイトにできる！」と話していますが、
どのくらい簡単にDEMOデザインを自分のサイトへ反映できるのかイメージつかないと思います。
ここでは、DEMOデザインを自分のサイトへ反映する（デザインプリセット）までの工程を載せております。
JIN:Rを導入後、デフォルトのデザインが自動的に適用されている
JIN:Rをインストール後、うまく作動すれば上記のようなトップページになります。
WordPress管理画面からカスタマイズ画面へ移動
デザインプリセットをクリックする
DEMOデザインがズラッと並んでいる。選んだデザインの下にある「Download」をクリックすると…
写真付きなので、イメージつきやすい！
あっという間にDEMOデザインを適用完了！
「ダウンロード」のボタンを押すだけで、誰でも簡単におしゃれなサイトを作れる！
サイトデザインはすべて「JIN:R」におまかせしよう！
この記事では、「DEMOデザイン」について解説しました。
JIN:Rに用意されているDEMOデザインを使用すれば、
- ブログ立ち上げ後、すぐに整ったサイトデザインにできる！
- 記事執筆に集中できる！
- ワンクリックでだれでも簡単に適用できる！
IT未経験者でも、ブログ初心者でも簡単に整ったサイトを作ることができます。
JIN:Rにサイトデザインをすべておまかせして、記事執筆に集中できますよ！
JIN:Rのインストール方法・購入方法を以下で解説しております。安く購入する方法を記載しているので、あわせてご参考ください。
あわせて読みたい
JIN:Rの購入・インストール方法【安く購入する方法も伝授します】
ブログ初心者におすすめしたい
WordPressテーマ「JIN:R」
- 柔らかでおしゃれなサイトを１クリックで作れる！
- 初心者でも直感的に扱える！
- マニュアルとサポートが充実している！
- 【参加費永年無料】購入者限定のブログコミュニティに参加できる！
レンタルサーバー「ConoHa WING」とセットで購入すると1000円OFFで契約できますよ！
JIN:R広告
ABOUT ME
・会社員をしながらブログを書く人
・ブログに出会えたおかげで充実した毎日を送れております
・JINコミュニティ「BLOGCAMP」の住人
インターネット音痴なあなたでも、簡単にオシャレなサイトを作れるWordpressテーマ「JINR」をおすすめするサイトです！
・ブログに出会えたおかげで充実した毎日を送れております
・JINコミュニティ「BLOGCAMP」の住人
インターネット音痴なあなたでも、簡単にオシャレなサイトを作れるWordpressテーマ「JINR」をおすすめするサイトです！
