war diary

Building an Engaging, Captivating Experience


War Diary

Project Period





Web design
Web development

The War Diary site is an online version of War Diary: The Diary of Mike Rogers. This diary is a daily look at WW2 events through the eyes of a 13-year old boy as he lives through the Battle of Britain, the Dunkirk Evacuations and many other military actions.

About the Project

We were tasked to create a website for War Diary: The Diary of Mark Rogers. Through the site, users would be able to access different parts of the original diary in a user-friendly way.

Challenges We Overcame

Creating a Multi-Function Flip Book

A main hurdle we faced was finding a suitable flip book solution that could accommodate a range of functions. These functions included a commenting system, pop-up capabilities, and the ability to incorporate videos. Given the plethora of flip book plugins available, a significant amount of time and effort was invested in meticulously selecting plugins that not only had these functions, but also excelled in facilitating fundamental tasks like uploading page assets and hyperlinking to selected flip book pages.

Engineering An Immersive Experience

The second key challenge was about going beyond providing online access to the diary, and crafting an immersive experience around it. To achieve this, we introduced captivating background music, authentic black-and-white photographs taken during World War 2, and rugged typography styles. These elements served to capture the turbulence and challenges of that historical period.

Curating and Building a Key Events List

Given that the diary chronicles the entirety of World War 2 (1939-1945), Mark Roger’s diary is quite extensive. As such, yet another challenge was curating and providing access to key events in the diary. The first step involved collaborating closely with our client to shortlist up to 20 pivotal events for each year. These events appeared as hyperlinks on the homepage, seamlessly directly users to the corresponding diary pages in just one click.

The Final Result

We crafted a deeply engaging website that transports users back to the days of World War 2, allowing them to intimately experience the unfolding events through the perspective of Mark Rogers. We hope that this website serves as a highly educational and intriguing resource that excites both students and history enthusiasts alike.

Need help with your website?

Speak to our website specialist.


Our End-To-End Web Services.

JIN Design services icon - Start

Design & Development

Web design and web development for your  custom website requirements.

JIN Design services icon - convert

WordPress & Website

WordPress, Webflow or WooCommerce design & development services for your website needs.

JIN Design services icon - optimise

Convert & Optimise

Optimise your website  performance and enhance its Google PageSpeed score. 

JIN Design services icon - maintain

Website Maintenance

Maintain your website content and ensure your website is safe and secure.