https://github.com/giuseppetm/syndrome-main-computer

"The Incredibles" Reproduction of Syndrome's main computer (Kronos unveiled sequence), made with React.
https://github.com/giuseppetm/syndrome-main-computer

incredibles javascript kronos kronos-project kronos-unveiled operation-kronos project react reactjs reproduction syndrome syndrome-computer the-incredibles web-application webapp website

Last synced: 21 days ago
JSON representation

"The Incredibles" Reproduction of Syndrome's main computer (Kronos unveiled sequence), made with React.

• Host: GitHub
• URL: https://github.com/giuseppetm/syndrome-main-computer
• Owner: Giuseppetm
• License: mit
• Created: 2022-01-22T12:32:01.000Z (almost 3 years ago)
• Default Branch: main
• Last Pushed: 2024-03-22T19:43:03.000Z (9 months ago)
• Last Synced: 2024-11-30T04:50:20.417Z (about 1 month ago)
• Topics: incredibles, javascript, kronos, kronos-project, kronos-unveiled, operation-kronos, project, react, reactjs, reproduction, syndrome, syndrome-computer, the-incredibles, web-application, webapp, website
• Language: JavaScript
• Homepage: https://syndromemaincomputer.netlify.app
• Size: 81.8 MB
• Stars: 13
• Watchers: 2
• Forks: 0
• Open Issues: 3
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
## Syndrome Main Computer ("The Incredibles", Kronos Unveiled Sequence)

[![MIT license](https://img.shields.io/badge/License-MIT-blue.svg)](https://lbesson.mit-license.org/) 

[![Netlify Status](https://api.netlify.com/api/v1/badges/3564b000-f9d8-47ee-9c26-78ab0b0b5a7c/deploy-status)](https://app.netlify.com/sites/syndromemaincomputer/deploys)

[![GitHub issues](https://img.shields.io/github/issues/Giuseppetm/syndrome-main-computer)](https://github.com/Giuseppetm/syndrome-main-computer/issues)

![Preview](https://user-images.githubusercontent.com/52317197/182917717-48b535b0-2a95-4b74-af68-0d287f782c86.gif)

I am a big fan of "The Incredibles" movie (2004), and I've always been fascinated by the [user interface](https://www.youtube.com/watch?v=IRPI3lSACFc) Syndrome had on his computer in the giant room: for this reason I decided to replicate it rather quickly as a web application. 

🎦 [LIVE PREVIEW](https://syndromemaincomputer.netlify.app/)

[![image](https://user-images.githubusercontent.com/52317197/169821832-94ade0d4-e1a9-4c00-8b62-e3a1c8303d3d.png)

You can find the YouTube video I made about the comparison with the movie sequence here.](https://www.youtube.com/watch?v=2-cToQpNnaU)

## Comparison with the movie sequence

|Image from the movie | Syndrome Main Computer reproduction |

|---|---|

| ![image](https://user-images.githubusercontent.com/52317197/183285350-2eb4aa72-1945-4cd3-876d-afe8f3f308a6.png) | ![image](https://user-images.githubusercontent.com/52317197/183285356-0b08c4fc-eb0a-4c20-b858-1907a1c2b441.png) |

| ![image](https://user-images.githubusercontent.com/52317197/183285410-69745cb6-5046-4e03-bfa6-cdca3c40ad18.png) | ![image](https://user-images.githubusercontent.com/52317197/183285421-e61eae2e-6eef-4241-8c8f-9fd55a51bff5.png) | 

| ![image](https://user-images.githubusercontent.com/52317197/183285590-a8cd405c-218f-4d33-b727-11f4b84d2b15.png) | ![image](https://user-images.githubusercontent.com/52317197/183285685-a3f760c8-6f06-4c68-9359-1464a14a5455.png) | 

| ![image](https://user-images.githubusercontent.com/52317197/183285756-8828568c-c25b-46b0-8f26-261de40c3b56.png) | ![image](https://user-images.githubusercontent.com/52317197/183285765-06c77d7c-0aaa-40bc-9989-b0388202edc1.png) |

| ![image](https://user-images.githubusercontent.com/52317197/183285781-041b2981-2b3a-4485-a0c3-ea340d743567.png) | ![image_2022-12-09_21-47-52](https://user-images.githubusercontent.com/52317197/206793915-7c3301ad-9cab-4a8a-bb46-a196c1ac71b5.png) |

| ![image_2022-12-09_21-48-36](https://user-images.githubusercontent.com/52317197/206794019-84c39d8e-9942-480f-859b-b27d284023d0.png) | ![image_2022-12-09_21-47-36](https://user-images.githubusercontent.com/52317197/206794043-ce13f693-5369-4098-98c1-60b99280ba92.png) |

| ![image](https://user-images.githubusercontent.com/52317197/183285812-e3ca04b4-5910-4e93-a205-a2e1802cf891.png) | ![image](https://user-images.githubusercontent.com/52317197/183285898-88a973d9-bcf6-4128-9db8-d81bd22938c8.png) |

| ![image](https://user-images.githubusercontent.com/52317197/183285822-b19b219d-2150-4602-ae2b-4493d1cf5905.png) | ![image](https://user-images.githubusercontent.com/52317197/183285931-12745a2c-b7d3-42d6-b45a-77e56b8ff096.png) |

| ![image](https://user-images.githubusercontent.com/52317197/183285831-9b332c47-6481-428f-84d6-19910f33e55d.png) | ![image](https://user-images.githubusercontent.com/52317197/183285938-7839b31e-0d42-423e-8a1f-6f198f1032ec.png) |

| ![image](https://user-images.githubusercontent.com/52317197/183285839-488de04d-21e2-47a5-95a2-932441236c3d.png) | ![image](https://user-images.githubusercontent.com/52317197/183285945-f2be9a09-48f6-4066-921d-c3b4841bb983.png) |

| ![image](https://user-images.githubusercontent.com/52317197/183285854-762ccc22-7d46-49a2-b308-61483377d223.png) | ![image](https://user-images.githubusercontent.com/52317197/183285955-a7e331eb-122a-4780-b6fa-996d44b3e2e9.png) |

## How to run the project

Set node version to v14 with NVM (`nvm use 14`), install the dependencies with `npm install` and then run the webapp locally with `npm run start`.