GithubHelp home page GithubHelp logo

brain_fitness_test's Introduction

WDI Project #1: The Game

This is a memory game that requires users to remember the light up sequence and input the correct sequence correctly in order to proceed to next level.

DEMO: https://jaanhio.github.io/brain_fitness_test/

Install as Chrome extension: https://chrome.google.com/webstore/detail/brain-fitness-test/hijachfllaccimdimegmfoblmafhikdf?hl=en-US&gl=SG

Further details on project scope: https://github.com/wdi-sg/wdi-better-underdog/tree/master/project-1


Design process

Sketch + invision are used in the design process via creation of mockups.

As increasing number of users are moving towards the mobile platform, i have decided to take the mobile-first approach for my MVP. Once building of MVP is completed, design for larger screen devices (e.g desktop, laptops, tablets) will be implemented to allow for a better user experience.

To ensure an enjoyable user experience, layouts and dimensions of components are carefully considered.

I have decided to go for a clean minimalist approach to make it clear what users have to do without further explanations.

Buttons and game components are centered horizontally and placed closer to bottom of screen to allow for comfortable access using one hand.

Colors (pastel colors), fonts, shapes, animations are selected for a more cheerful gaming experience.

Further details on my design can be found here: https://projects.invisionapp.com/share/MAG9LNDNW93#/screens/283952611


Challenges

The main challenge of building this project is implementing the game sequence (i.e tile lighting sequence, user inputs, checking of inputs etc) correctly.

Due to the asynchronous nature of Javascript, various web APIs methods (setTimeout, setInterval, clearInterval) are used to queue the sequences.

An alternative to the above might be with the use of Promises. More research/testing has to be done to check feasiblity of implementatiom with Promises.


Feel free to drop me a message if there's any question!

brain_fitness_test's People

Contributors

jaanhio avatar

Watchers

 avatar  avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.