What inspired this design?

I wanted this guide to feel like something a player might stumble upon in the fog — both informative and immersive. Dead by Daylight has such a distinctive atmosphere that balances fear with curiosity, and I wanted to capture that tension through structure and tone. The concept of a “field guide” felt perfect for that balance — a mix of technical documentation and eerie exploration. Every section was built to read like an explorer’s log for surviving the Entity’s realm.

How did you choose your typography?

For headings, I used Love Ya Like A Sister because it has that gritty, distressed texture that fits the horror aesthetic while still being legible. For body text, Istok Web kept everything readable and professional. I liked the contrast between the chaotic look of the headings and the clean, grounded feel of the text — it mirrors the tension between survivors and killers in the game. Together, they feel like the kind of type pairing you’d see in a well-designed in-game manual or lore book.

What mood or tone does your color palette convey?

I went for a dark, foggy palette that reflects the game’s environment but still works for a documentation site. The deep black (#0D0D0D) and fog gray (#E5E5E5) create contrast and legibility, while the purple (#540B64) and steel blue (#4B6E91) add personality and mystery. It’s moody without being overly harsh — something that feels alive with tension but comfortable to read through, like standing near danger but still in control.

How did you adapt your layout for mobile?

For the desktop version, I used a fixed sidebar to anchor the navigation like a digital handbook, but on mobile, it shifts to a top navigation bar to make scrolling smoother. The content stacks vertically, and decorative fog elements are hidden to keep it clean and readable on small screens. I wanted the mobile version to still feel cohesive with the desktop — same atmosphere, just simplified. It’s a lighter experience but still holds that sense of immersion.

What challenges did you face or insights did you gain?

The biggest challenge was balancing readability and theme. It’s easy for dark horror aesthetics to get muddy or overpowering, especially when designing for accessibility and web readability. I learned how to use subtle texture and controlled color contrast to maintain both immersion and clarity. This project also helped me think more like a front-end designer — planning hierarchy, spacing, and typography in ways that would translate cleanly into HTML and CSS later. It’s definitely one of those designs that taught me how structure and mood can work hand in hand.