blurify

Overview

This app act as an exclusion simulator : it tries to demonstrate how hard it can be to consume digital services with a visual impairment.

• This app consumes @mediapipe/camera_utils & @mediapipe/face_mesh libraries

• It is heavily inspired by Susanne Thierfelder's article on Medium (linked code is visible here )

• For now the app is visible on https://blurify.onrender.com/

Github Pages

In case of repository renaming :

ViteJS config

In vite.config.js change base to /REPO_NAME/

Development

The face detection logic is stored in src > components > FaceDetection.vue It is consumed directly in App.vue where the rest of the logic can be configured (bluriness)

Recommended IDE Setup

VSCode + Volar (and disable Vetur) + TypeScript Vue Plugin (Volar).

Customize configuration

See Vite Configuration Reference.

Project Setup

npm install

Compile and Hot-Reload for Development

npm run dev

Compile and Minify for Production

npm run build

Lint with ESLint

npm run lint