ポートフォリオサイトのこだわりポイント

はじめに

ポートフォリオの一部が完成しました。実は以前からポートフォリオはありましたが、汎用的なポートフォリオは読まれないということに気づいたため、今回は趣味を一部盛り込んでいます。

まだまだ改善したい余地は多く残っており、こだわりが足りていない部分もありますが、今のところこだわった点をお話したいと思います。

例によってこのブログはまだ画像機能があまり強くないので、まずは画像なしでお話しします。

従来は縦画面かつ網羅的に見やすいだろうということで、簡単なリンクとタイトルと簡易的な自己紹介を入れていました。

一方でHEROセクションは本来そういうものではなくサイトそのものを形作るものだと思います。自分が今まで何に影響され、何を作ることができ、このサイトの方向性がどうなのか一目で分かるようにするという目的があるはずです。

簡単なHEROセクションを作ったあとに実際に他の方のポートフォリオを見て回りました。
感想としてはプロのエンジニアさんはすごいなと思いました。デザインに全振りしたものもあれば、見やすさを保ちつつおしゃれにしているものもありました。

そこで私は「TRPGのルールブックのような装丁」をテーマに抜本的に設計を見直しました。

TRPGとは直接関係ありませんが、好きな本のデザインを参考にHEROセクションのタイトルを作ったところ、思った以上に自分の中でしっくりきました。

現時点ではパソコンで見たときにあまり本っぽく見えないのでいずれ本のような見た目にはしたいのですが…思ったよりも良い出来だと感じています。

一方でまだアナログな表現にとらわれていて、デジタル空間ならではの動きがないのが気になります。もっと自由に、大胆にエフェクトを入れて、例えば本らしく見せるのはもちろん、魔導書らしく文字が動くような演出を入れるとかも面白そうです。

2ページ目からは2カラムの紙ベースな雰囲気を出しています（スマホなら1ページずつ表示）。

紙、あるいは本らしさを出すならこだわらないと、ということで、背景のテクスチャはもちろんCSSの装飾にもこだわりを入れています。

ただ残念なのは、UX自体はマウスカーソル・スクロール・スワイプ・クリックで対応できるようにしているものの、ページ遷移だけは現時点で「ページをめくる」という体験を作れていない点です。

技術的にも難しく結構思い悩んだのですが、今後もポートフォリオにデータを追加していく都合上、そこまで作り込むと後で手を入れた際のリグレッションが大変そうなので、一旦このままにしています。

あと、ページ自体は本風なのですが厚みがありません。データ的にもビジュアル的にもです。なのでページがめくられる動作を作るなら、今レンダリングされているページの横に紙が並ぶような表現にして、本の厚みを演出したいですね。

今回、HexWolfというペンネームは実は土壇場で決まりました。ドメイン名をどうしようかと考えたとき今のHNであるオオカミコウタだと語感が今ひとつだと思い、英語名を考えようというところから始まりました。

TRPGwolf、あるいはダイヤウルフならぬdicewolfなども考えたのですが、競合が結構ありまして。私自身はやったことがないのですが、D&Dなどでよく使われるマス目のモチーフである六角形（hex）からhexwolfにしました。

じゃあなぜhexにしたのかと言われるとうまく答えられなかったので、色々頭をひねった結果、「自分がこうでありたいと思う標榜を立てればいいのでは？」と思いつきました。前後関係は逆になりますが、元々こうでありたいという思いは持っていたので、何を掲げるかはあまり悩みませんでした。

この6つを目標に日々頑張ります。

まだ完成していない部分が多いので、卒業制作を作りながら徐々に完成を目指します。