はてなブログでは2021年2月26日（金）まで「デザインテーマコンテスト」を開催中です！ そこで「0からはじめるブログデザイン」と題し簡単なデザインカスタマイズからデザインテーマ作成まではてなブロガーさんのアイディア詰まった記事をご紹介する連載をしています。
第3回となる今回は、はてなでデザイナーとして働く
id:k_44hawk さんと 
id:ueday さんにはてなブログのデザインの作成方法からこだわりポイントまでじっくりテキストインタビューで聞きました。
ぜひデザインテーマ作成やデザインカスタマイズの参考にしてみてください！
はてなブログの公式デザインテーマ、どんなところにこだわって作られている？
──これまで作成したテーマの中で最もよくインストールされている公式テーマを教えてください。
k_44hawkさん
現在、公式のデフォルトテーマ（初期設定のテーマ）として使用されている「Smooth」です。
ueday さん
「Epic」です。
──テーマに込められた思いやストーリーはありますか？
k_44hawkさん
文字が主役になるシンプルなものを目指しました。
日記や感想を書いたときに文章を邪魔しないデザインにしたかったためです。
ueday さん
自分が初めて作ったテーマであり、はてなブログがまだ世に出ていなかった頃に作られた最初期のテーマでもあります。テーマ名が決まるまで、社内で「Alpha」のコードネームで呼んでいました。
──テーマのこだわりポイントは？
k_44hawkさん
見出しを明朝体にして個性を出したところです。
今まで公式テーマで明朝体が使われたものがなかったので、面白いのではないかと思ったのがきっかけでした。
明朝体を使うことで上品さが出るので、ちょっとした日記も少しだけ特別感がプラスされて自分だけの宝物になると考えました。
ueday さん
「はてなブログ」と「はてなダイアリー」の2つのブログサービスが存在する時代に作ったテーマなので、はてなダイアリーとは違うものだと伝わるテーマを目指して開発した記憶があります。また、デフォルトテーマとして、どんなブログにも汎用的に使えることを意識しました。
使っているツールから作業の流れまで、はてなデザイナー流、公式テーマの作り方
──デザインテーマ作成の際におすすめのツールやエディターはありますか？
k_44hawkさん
難しい！
色々使ってみて自分が使いやすいものが一番だと思います。
私はエディターはATOMが好きで長年使っていました。見た目がシンプルで気に入っています。
ただ、仕事で使うとなるとVisualStudioCodeが便利ですね。
ueday さん
使っているデザインツールはAdobe XDやIllustrator、エディタはVisual Studio Codeです。ほかの方の環境とあまり変わらないと思います。
──作業の大まかな流れについて教えてください！
k_44hawkさん
- どんなテーマを作りたいか考えてラフを書きます。
- ブログのトップと記事ページのデザインを作成して、コーディングに入ります。
- テーマ全体のスタイルを整えてから、細部を作り込んでいきます。
- 各ページを確認して、崩れているところがないか・スタイルがあたっていないところが確認します。
- レスポンシブデザインの場合、スマートフォンでも同じく確認します。
- 完成！
また、ページを確認するときはサンプルエントリーをいくつか入れると確認しやすくて便利です。
ueday さん
「こんな用途に使ってほしい」と想定して作るので、さまざまなブログをまず観察します。テーマ制作の半分以上の時間をこの作業に費やしていると思います。イメージが固まったら、それに近い内容の文章や写真を使ってデザインや実装を行っていきます。
デザインテーマをカスタマイズする上で抑えておきたい要素って？
──はてなブログのデザインテーマで個性を出しやすい要素はどこだと思いますか？
k_44hawkさん
ヘッダや見出しでしょうか。
テーマ全体にかかる部分や、ブログの見出しは個性を出しやすい要素だと思います。
ueday さん
日付などの数字まわりは表現のアクセントにしやすい印象です。
──逆にデザインテーマ作成で一番難しいと感じる要素はどこですか？
k_44hawkさん
設定の有無で表示されるものが変わったりするので、各要素の余白の取り方です。
あとはスタイルがあたっていない部分を探したり…。
といってもヘルプにチェックリストがあるのでそこを見ればなんとかなりそうですね。
私はテーマを作った後にここに気づきました！笑
ueday さん
テーマを作っている段階では、実際の使われ方は想像することしかできない点です。たとえば文章の書き方をとってみても、改行をよくする人、あまりしない人、長めの記事タイトルを好む人、短めの人など、無数のパターンがあります。すべての理想を叶えようとすると器用貧乏なデザインになってしまうので、ある程度「こんなふうに使うだろう」と決めて設計するわけですが、少なくとも通常の用途できちんと表示できるよう、想定しながら作る必要があります。
──最後に、「デザイナーから見たはてなブログの魅力」を教えてください。
k_44hawkさん
記事の編集画面が使いやすく、サッと書き始められるところです。
編集モードが複数あるので、自分の表現したい内容によって変えられるのも好きです。
また、多数のテーマが用意されているので、専門的な知識がない方でも自分だけのブログをすぐに作れるのもいいですね。
誰でもすぐに始めることが出来て、こだわりたい時はとことんこだわることが出来る。
そういう2つの顔がはてなブログの魅力ではないでしょうか。
ueday さん
ひとの人生を書き残す行為そのものを尊いとする、はてなブログの価値観がユニークだと思います。また、読み手にとっては、ブログという窓を通じて他人の頭の中を覗き見るようなスリルと発見があります。自分にとって大事なこと・好きなことを、それぞれの視点から言葉にする場であることが、はてなブログの魅力かなと思います。
週刊はてなブログでは、ユーザーさんのテーマ作成体験談を記事にまとめています！デザインテーマを作られる際やデザインカスタマイズをする際に是非参考にしてみてくださいね。
「早速テーマを作ってみたい！」という方は以下のボタンからチャレンジしてみてください！
※応募要項をよく読んだ上でご応募ください。なお、はてなスタッフが投稿を確認し、既存のデザインテーマの軽微な改変や実用が困難なテーマは対象外とします。
