エモクロアTRPG公式サイト

https://emoklore.dicetous.com/

2021.3.19 ダイスタスチーム様

Web Design & Coding

あなたと共鳴する物語体験を。
『エモクロアTRPG』

ダイスタスチーム様より、Web上で閲覧可能な『エモクロアTRPG』のルールブック（公式サイト）を制作いたしました。

Point

Web上で、特にスマートフォンでルールブックを閲覧できることを第一に、まずはサイトマップの作成からスタートしました。
特に時間をかけた部分は、！マークをクリックした際に表示されるツールチップ機能です。
必要最低限の内容以外を格納する方法をどう設計するか、どうスマートフォンでも無理なく表示するかと言う点で悩みました。

スタイリング面では、ルールブックがメインとなるため、シンプルで見やすいデザインにしようと心がけました。
キービジュアルが十分に魅力的なものだったので、エモクロアの世界観を表現するには十分でした。

Skill

Figma / HTML5 / CSS3 / Sass / jQuery / EJS / gulp.js