![見出し画像](https://assets.st-note.com/production/uploads/images/3112621/rectangle_large_ff3b4e4b3487a4bce5357cdcf451c836.jpg?width=1200)
noteのデザインを変えてみる
先日、noteの画像サイズを調べていたら、おもしろいものを見つけました。
あなたのnoteがもっと読まれる。表紙用イラストセット。
このページには、note上で使えるさまざまな画像が販売されています。
イラストはシンプルで親しみのあるデザインで、小説やコラム・日記などにマッチするように作られているそうです。
文章中心のコンテンツを作っている人は、表紙画像のことは後回しになりがちです。
ついつい後でやろうと思って、結局表紙を設定しなかったということもあるので、こういうサービスはなかなかいいと思いました。
noteの表紙画像を自分で作ってみた
ただ、こういうサービスの問題点は、単調になりがちなところです。
たまに使用する程度ならいいかもしれませんが、毎回同じ表紙画像を使っていると、さすがに飽きてきます。
やはりタイトルに合わせて、デザインを変更できた方が新鮮な感じがします。
そこで、無料で使える画像編集ソフト「Inkscape」を使ってテキストの表紙画像を自分で作ってみることにしました。
<作成例>
(※作り方については、過去記事「note の表紙画像をInkscapeで作る方法」で、くわしく説明しています。)
noteの表紙画像を自分で作るメリット
高いオリジナリティが保てる
フリーの写真素材とは違って他人とかぶってしまうことが完全になくなります。一つ一つ手作りで作るので、単調になることなく新鮮さを保てます。
記事内容に合わせたイメージを印象づけられる
記事内容を理解した上でデザインしているので、内容に合わせたイメージを読者に印象づけられます。インパクトのある写真素材のように関係のないまで引きつけてしまうことがなくなります。
電子書籍の表紙に再利用しやすい
表紙画像のデータを再利用して、すばやく電子書籍に必要な表紙画像を作成することができます。そのためテキストを作成してから電子書籍化するまでの時間を大幅に短縮できます。
この他にも、イラスト作成のスキルを学べるなどメリットは数多くあります。個人的には「作る楽しみが増えた」こと、「去記事をリライトしやすくなった」ことが一番大きいと感じています。
記事内のデザインも変えてみた
表紙画像だけでなく記事内のデザインも変えてみました。
今まで気になっていたのは、長めの文章を書いた場合に少々読みにくくなるという点です。
段落と段落の間に広めのスペースをとるなど対策は一応ありますが、余計なスペースはなるべく設けたくありません。
そこで考えたのが、段落と段落の間に区切りとなる線(罫線)を入れることです。
これがあると、長文でも読みやすくなります。
note上ではnote専用で使える罫線がいくつか公開されています。
(※noteの検索機能で「素材」と打ち込んで検索するとヒットします。)
【素材】noteで使える飾り罫線 投げ銭専用編
【素材】noteで使える飾り罫線 シンプルガーリーライン編
【素材】noteで使える飾り罫線 ハート編
【素材】noteで使える飾り罫線 アールヌーボー編
実際に見ていただければ分かる通り、とってもオシャレでかわいらしいものばかりです。
女性が使えば、きっと人気度がアップすることでしょう。
しかし、男性が使用する場合は少々かわいらしすぎます。
おそらくハートの罫線を男性が使った場合、フォロワーがいっきに減ってしまうでしょう。
そこで、罫線も自分で作ってみることにしました。
最近使用しているのは、インデックスのようなちょっとした区切りになるものです。
作成する上で、気をつけたことは「文章よりも目立たないこと」です。
あくまでテキストが主役なので、それを見やすくしてくれるように作りました。
また、高さを30pxほどに調節し、余計なスペースを入れなくて済むように工夫しています。
色は上記のようにさまざまな色に変更可能です。表紙デザインと合うように作成できます。
そのほか、段落と段落の間に、ちょっとしたイラストを載せてさらに見やすくしてみました。
こちらは引用するサイトを目立たせるための吹き出しです。
ページの最後には参考にしたサイトを掲載することが多いので、「参考」と書いた専用の区切り線なども用意しています。
あなたのnoteにぴったりと合う画像素材を作ります!
先に紹介した区切り線やちょっとしたイラストなどはコピペして使用してもかまいません。
右クリックして画像を保存するを選択すればダウンロードできるはずです。
ただ、おそらく多くの人にとって必要なのは、誰かのために作られた画像素材ではなく、自分のnoteにぴったりと合う画像素材だと思うのです。
特に文章を書いている人は、書かれている内容に合う表紙画像が欲しいのではないでしょうか。
区切り線も、ちょっとしたイラストも同様に表紙画像とマッチするものの方がいいはずです。
そんなわけで、もし「自分のnoteにぴったりと合う画像素材を作ってほしい」という方がいれば、こちらでお引き受けして作ってみようと思います。
申し込みはこのnoteのコメント欄で。
作ってほしい画像素材の簡単な説明と、そのイメージに近い画像URLを貼り付けてください。
テスト段階ですので、料金などは不要です。
ちなみに、表紙画像の作り方については、過去記事「note の表紙画像をInkscapeで作る方法」でくわしく説明しています。
時間に余裕がある人はぜひ試してみてください。
操作方法などで質問があればできる限り丁寧にお答えいたします。
<追記 2016/07/18>
「noteでアイコンフォントを使う方法」を追加しました。
この記事が気に入ったらサポートをしてみませんか?