D8RKMATTER

Kiosk Venue Web Application

Status: Final Revision
View sourceView live demo

Project Spec

TASK: build a multilingual kiosk web app for an events venue. This kiosk will run locally in the venue. End-users will see and interact with content via a 24" touch screen interface. This app should:

  • Show basic venue information in a modern UI
  • Support basic app functions such as links, back button, etc
  • Run on modern browsers
  • Be easily updatable by authorized users via a user interface
  • Support multilingual content, starting with Spanish and English, with the possibility of adding more in the future
  • Support both informational/static and interactive content
  • Support basic kiosk features such as periodically resetting the session after a period of inactivity and gracefully handling network issues

Scope of work

Design work will be done by a small design team. Based on requirements, this project will be handled with a customizable headless CMS. This will help eliminate the complexity of creating a custom CMS and instead will allow the focus to remain on rapid development and prototyping. Also, a CMS with i18n will take care of the complexity of supporting multi-lingual content.

Stakeholders want content and data to remain on-prem for now, so CMS and platform should support self-hosting. Also, since this kiosk will be a proof- of-concept, app and data requirements are expected to be fluid and changing.

Chosen technologies:
  • CMS: Strapi
  • Server/Platform: NextJS
  • Frontend: NextJS pages with ReactJS
  • SSG Data Sourcing: Strapi CMS via GraphQL

Development stages

There are some stages that require waiting for stakeholders and designers. However, some work can begin in parallel.

  1. Research tools and technologies
  2. Write tentative data requirements
  3. Receive draft mockups from design team and begin prototype development
  4. Present to stakeholders and iterate steps 3 and 4 as necessary
  5. Begin more refined development with better-defined app requirements
  6. Usability / end-user testing (prepare for launch & delivery)
  7. Delivery

Progress

We received feedback on first iteration of prototype and currently building out the second iteration in collaboration with the design team.