History rediscovered.

Historik

ADDY Award 2020 Icon
LOGO DESIGN
elements of
advertising
ADDY Award 2020 Icon
LOGO DESIGN
elements of
advertising

The client and brief

Contribution

  • Brand development
  • Product design
  • User Experience Design (UXD)
  • Rapid prototyping
  • Web design/development
  • Business development
  • Print collateral
  • Iconography

Tools used

  • Figma
  • Jira/Confluence
  • Adobe Illustrator
  • Adobe Photoshop
  • Lucid Chart

History is a disconnected experience. Wherever you go, each community serves up history in a different way. Historik was founded in 2019 to harness the latest advancements in technology to create an immersive history experience.

The objective was to build a solid brand, an immersive mobile app, and a platform anyone could use. Our customers are young and old, so the products we build must be simple yet engaging. The design needs to introduce technology that some have never heard about but are eager to explore. The products have to be adaptive and the mobile app has to work on both iOS and Android.

Building a team of seven talented software engineers, here is what we were able to achieved in 12 months.

visit the historik website

The identity:

Design an identity that will be instantly identifiable and pay homage to the past.

When I began creating the identity, I wanted it to pay homage to the past while being timeless and relevant in modern times. I created the typeface from scratch to ensure the design was uniquely it's own. I incorporated elements from the first American flag created in 1776. I selected subdued colors to make it appear more traditional.

User flow:

Explore multiple ideas in great detail.

I try and discipline myself to use different mediums when I create. I broke out the graph paper, pens, pencils, and markers before starting on the computer. I wanted to wireframe the user flow without colors, text, and other visual elements getting in the way.

Mind mapping:

Make history intriguing so people don’t get bored.

History is fascinating, but it can be lacking due to the mediums used to engage people. It was vital to me to spend time digging into experiences that could keep history engaging and exciting for the users wherever they might be. I started by fleshing out the mind mapping for the mobile app. I reworked the mind maps several times before feeling good about the result.

Historik userflow mockup

Qualitative data:

Interview as many potential users to improve the product experience.

Mobile app and platform decisions are improved upon through qualitative data research. Several dozen potential consumer app users and actual historical institutions were interviewed. I shared early alpha designs to provide feedback on how the products should behave, in which order a part of the experience made the most sense, and what might be missing to make a more delightful experience. These interactions helped provide a more streamlined, functional product for both audience groups. I continue to use qualitative data until we have the numbers/analytics to provide more quantitative data for further improvements.

A solid design system:

Develop a consistent design system that scales as the company does.

The most common way I explain Historik to people is that we are a company building one database but multiple products. That first product is the Historik App, but more are to come. For this reason, I used Figma to create a design system that could scale across additional products. Of course, a design system evolves, and so has this one—a new font style here, a new color tint there, or a new component.

visit historik.com

The platform:

A clean and user friendly interface for all ages.

Credit:

  • Jake Jones - DB architecture, Backend development, API, strategy
  • Petyon Critchfield - Backend, Project manager, software engineer
  • Andre Clark - Software engineer
  • Me - Product design, prototyping, design system, content writing, iconography, wireframing, mind mapping

The platform is the heart. It is what beats historical stories in the products we develop. I was responsible for ensuring the user experience was dialed, we used our design system to its fullest potential, and we designed an interface with the wide-spreading user in mind. It must be easy to use for the retired volunteer of a community museum. It also needs to be feature-packed for the young twenty-something history nerd that loves the idea of creating immersive stories with the Historik technology.

The platform had to provide a thousand-foot view of any story and get granular enough to update any one piece. Part of that journey was building a story wizard that would walk users through each element of the story creation process. It also had to think about the future by providing the ability to add 3D models to a story, embed QR codes for marketing purposes, and add value to institutions through unique profiles that could help draw people to their institutions.

Story wizard interface, login screen.Story list view on platform.Unpublished changes screen in Historik platform.
Story wizard interface, select category type.Story wizard interface, upload images screen.Historik user profile screen.
Home screen of Historik mobile app.Map view of Historik mobile app.Story view of Historik mobile app.

Mobile applicaiton:

The portal to the past, packed with features.

Credit:

  • Johan Walhout - Flutter developer
  • Jignesh Patel - Flutter developer
  • Petyon Critchfield - Backend
  • Jake Jones - Database
  • Me - Product design, prototyping, design system, content writing, iconography, wireframing, mind mapping

The mobile application is the vehicle for interacting with history anywhere. My task was to take the previously explored mind maps and user flows and define how they would all come together into a cohesive interface. I knew a few key elements that had to shine in this app to help it be a sticky experience. It had to give the user a feeling of personalization, it had to give the user the ability to tailor their interests, and it had to be packed with technology no one else was playing with.

The mobile app also had to be effortless to use. It began in the wireframes and quickly iterated into a high-fidelity prototype over 30 days. The result was something that could be shared with potential investors to help cast the vision of this product. By December 2021, the prototype and business model helped Historik secure $150,000 to make the dream a reality.

Wireframes

Final mobile app design

Historik login phone screenHistorik filtering phone screen.Historik search phone screen
Historik home phone screenHistorik filtering phone screenHistorik profile phone screen
Historik map view phone screenHistorik bookmarks phone screenUser profile stats on Historik app.
Historik map view phone screenHistorik Wilma story phone screen

Augmented Reality of the past:

Place history back where it no longer exists with technology.

Historik wants to bring the past back to life by recreating it using Augmented Reality and putting it back where it once stood. I worked with the incredibly talented Historik team to think through this process to break this into phases. This would ensure we could meet each goal faster.

The first phase would be to create a scaled 3D model. Platform users would be able to upload a scaled model and publish it to a story. Then, the mobile app user could access the story with a 3D model attached and place the 3D model in Augmented Reality using a smartphone. The second phase would require more time and resources, allowing the 3D model to be placed at the original location using 3D positioning tools. Soon, history will be able to exist anywhere, even if the physical location no longer exists.

Hidden history:

Encourage users to go out and explore history.

A unique feature that needed to be thought through was a how to gamify the app experience by hiding history on a map and allowing users to discover it by exploring. I thought about how users connect with Pokemon Go and Geocaching and came up with a new spin using old images.

Old images would be given coordinates. Where the main object in the photo is and where the photographer stands. With those two coordinates, a user would be notified when they were near. Through a simple push notification, users would be provided with a compass, ball, and distance. The hunt would be on. Once the user reached 0, the compass would disappear, and the old image would be revealed on the user's screen. The individual is now standing exactly where the photographer once stood. Now the user can match their image to the environment around them.

visit historik to learn more
Hidden History screen with compass
Historik tain image landscape view 02Historik tain image landscape view 01
Hidden History badge award
Hidden history train image on phone screen.Hidden history train image on phone screen.Phone notification screen.Hidden history compass phone screen.
A hand holding phone with an old image of a train and showing the train in today's environment.

Conclusion - Bigger than myself:

Just because it is monolithic, doesn’t mean you stop trying.

Credit:

  • Chris Whalen - Brand, Product Design, Biz Dev, Marketing, and Sales
  • Jake Jones - CTO, Database Architect, and Biz Dev
  • Peyton Critchfield - Software Engineer and Scrum Master
  • Andre Clark - Software Engineer
  • Johan Walhout - Flutter Developer
  • Jignesh Patel - Flutter Developer

In 12 months, we were able to rally an incredible collection of talented engineers. We also designed, developed, and deployed four different products. In the first month after deploying the Historik Platform, we had six institutions signed up and creating stories. In the following months, we plan to grow those numbers. The beta mobile application will launch in the Android and iOS stores in July of 2022 as we continue to grow historical stories worldwide. Historik would have been impossible without the incredible team that helped make it a reality. The fun has just begun.

Finger pointing up icon
go to top
light
mode
dark
mode