ZenPop Dev Notes

notes.md

Dev Notes

Introduction

ZenDots take a break from the daily grind.

How to play

Dots move from the top to the bottom of the screen. A player tries to click on the dots and receives points when they are successful. Beat your last high score to add extra Zen to your day.

• Click the start button to play.
• POP as many dots as you can
• Pause to stop/restart the game
• Try and beat your last high-score

Features (addon)

• High score, use local storage to store and retrieve game high score
• Reset the high score
• Tooltips for easier game use.
• Reload game, user can reload the game
• In game modal using native <dialog> to display game help/dev-notes
• Live game indicators--color changing elements

Browser testing

• Tested in Chrome Windows (limited mac) and Edge (win).
• Not tested in Safari or Firefox (mac/windows)
• Not compatible with IE
• Not tested on mobile

Dev notes

• Opinionated use of onclick handlers in HTML for buttons provides a simple/safe way to add interaction
• Found issues while working in glitch--SASS, SVG.
• Updating to the latest version of SASS caused NPM errors (** first time using glitch).
• Uses deprecated sass imports instead of @use--old version of SASS complier.
• Glitch reports some SVG attributes as errors.

Roadmap

• play sound when user beats high score
• add a dark/light mode switch for UI.
• add directional arrow to tooltip
• ...

ZenDots