msb-public
/
app-ideas
mirror of https://github.com/florinpop17/app-ideas
2
1
Code Issues Projects Releases Wiki Activity

Merge ee4f43c83c into 08b771c863

Browse Source
pull/537/merge
jarupong pajakgo 2 years ago committed by GitHub
parent 08b771c863 ee4f43c83c
commit a5d52d5e81
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 55 additions and 22 deletions
Show Stats Download Patch File Download Diff File

32
Projects/3-Advanced/Change-SVG-Image-Color-App.md
Unescape View File

@ -0,0 +1,32 @@
# Change SVG image Color App
**Tier:** 3-Advanced
Let's say you want to create an SVG editor that can change color when you click on each color zone(SVG path or SVG group). your application can change the color of an SVG image and export it back with the same quality but different colors.
[Sample App](https://www.loom.com/share/a6aea98553c043078e4177e62d72f5c3)
[Sample SVG file](https://gist.github.com/annibuliful/7becdd187375799b8a8906f0d1d957ed)
## User Stories
- [ ] User upload SVG file
- [ ] User click on color zone
- [ ] User change color on current color zone
## Bonus features
- [ ] User can change color with gradient color
- [ ] User can convert SVG to PNG others format
## Useful links and resources
[W3school SVG](https://www.w3schools.com/graphics/svg_intro.asp)
[mozilla SVG](https://developer.mozilla.org/en-US/docs/Web/SVG)
[Canvas API](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API)
[DOM manipuldationn](https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Client-side_web_APIs/Manipulating_documents)
## Example projects
[Box svg](https://boxy-svg.com/)

45
README.md
Unescape View File

@ -119,28 +119,29 @@ required to complete them.
### Tier-3: Advanced Projects ### Tier-3: Advanced Projects
| Name | Short Description | Tier | | Name | Short Description | Tier |
| ----------------------------------------------------------------------------- | ------------------------------------------------------------------- | ---------- | | --------------------------------------------------------------------------------- | ------------------------------------------------------------------- | ---------- |
| [Battleship Bot](./Projects/3-Advanced/Battleship-Bot.md) | Create a Discord bot that plays Battleship | 3-Advanced | | [Battleship Bot](./Projects/3-Advanced/Battleship-Bot.md) | Create a Discord bot that plays Battleship | 3-Advanced |
| [Battleship Game Engine](./Projects/3-Advanced/Battleship-Game-Engine.md) | Create a callable engine to play the Battleship game | 3-Advanced | | [Battleship Game Engine](./Projects/3-Advanced/Battleship-Game-Engine.md) | Create a callable engine to play the Battleship game | 3-Advanced |
| [Boole Bots Game](./Projects/3-Advanced/Boole-Bot-Game.md) | Battling Bots driven by Boolean algebra | 3-Advanced | | [Boole Bots Game](./Projects/3-Advanced/Boole-Bot-Game.md) | Battling Bots driven by Boolean algebra | 3-Advanced |
| [Calendar](./Projects/1-Beginner/Calendar-App.md) | Create your own Calendar | 3-Advanced | | [Calendar](./Projects/1-Beginner/Calendar-App.md) | Create your own Calendar | 3-Advanced |
| [Calorie Counter](./Projects/3-Advanced/Calorie-Counter-App.md) | Calorie Counter Nutrition App | 3-Advanced | | [Calorie Counter](./Projects/3-Advanced/Calorie-Counter-App.md) | Calorie Counter Nutrition App | 3-Advanced |
| [Chat App](./Projects/3-Advanced/Chat-App.md) | Real-time chat interface | 3-Advanced | | [Chat App](./Projects/3-Advanced/Chat-App.md) | Real-time chat interface | 3-Advanced |
| [Contribution Tracker App](./Projects/3-Advanced/Contribution-Tracker-App.md) | Track funds donated to charity | 3-Advanced | | [Contribution Tracker App](./Projects/3-Advanced/Contribution-Tracker-App.md) | Track funds donated to charity | 3-Advanced |
| [Elevator](./Projects/3-Advanced/Elevator-App.md) | Elevator simulator | 3-Advanced | | [Elevator](./Projects/3-Advanced/Elevator-App.md) | Elevator simulator | 3-Advanced |
| [Fast Food Simulator](./Projects/3-Advanced/FastFood-App.md) | Fast Food Restaurant Simulator | 3-Advanced | | [Fast Food Simulator](./Projects/3-Advanced/FastFood-App.md) | Fast Food Restaurant Simulator | 3-Advanced |
| [Instagram Clone](./Projects/3-Advanced/Instagram-Clone-App.md) | A clone of Facebook's Instagram app | 3-Advanced | | [Instagram Clone](./Projects/3-Advanced/Instagram-Clone-App.md) | A clone of Facebook's Instagram app | 3-Advanced |
| [GitHub Timeline](./Projects/3-Advanced/GitHub-Timeline-App.md) | Generate a timeline of a users GitHub Repos | 3-Advanced | | [GitHub Timeline](./Projects/3-Advanced/GitHub-Timeline-App.md) | Generate a timeline of a users GitHub Repos | 3-Advanced |
| [Kudos Slackbot](./Projects/3-Advanced/Kudos-Slackbot.md) | Give recognition to a deserving peer | 3-Advanced | | [Kudos Slackbot](./Projects/3-Advanced/Kudos-Slackbot.md) | Give recognition to a deserving peer | 3-Advanced |
| [Movie App](./Projects/3-Advanced/Movie-App.md) | Browse, Find Ratings, Check Actors and Find you next movie to watch | 3-Advanced | | [Movie App](./Projects/3-Advanced/Movie-App.md) | Browse, Find Ratings, Check Actors and Find you next movie to watch | 3-Advanced |
| [MyPodcast Library](./Projects/3-Advanced/MyPodcast-Library-app.md) | Create a library of favorite podcasts | 3-Advanced | | [MyPodcast Library](./Projects/3-Advanced/MyPodcast-Library-app.md) | Create a library of favorite podcasts | 3-Advanced |
| [NASA Exoplanet Query](./Projects/3-Advanced/NASA-Exoplanet-Query.md) | Query NASA's Exoplanet Archive | 3-Advanced | | [NASA Exoplanet Query](./Projects/3-Advanced/NASA-Exoplanet-Query.md) | Query NASA's Exoplanet Archive | 3-Advanced |
| [Shell Game](./Projects/3-Advanced/Shell-Game.md) | Animated shell game | 3-Advanced | | [Shell Game](./Projects/3-Advanced/Shell-Game.md) | Animated shell game | 3-Advanced |
| [Shuffle Deck](./Projects/3-Advanced/Shuffle-Deck-App.md) | Evaluate different algorithms for shuffling a card deck | 3-Advanced | | [Shuffle Deck](./Projects/3-Advanced/Shuffle-Deck-App.md) | Evaluate different algorithms for shuffling a card deck | 3-Advanced |
| [Slack Archiver](./Projects/3-Advanced/Slack-Archiver.md) | Archive Slack Messages | 3-Advanced | | [Slack Archiver](./Projects/3-Advanced/Slack-Archiver.md) | Archive Slack Messages | 3-Advanced |
| [Spell-It App](./Projects/3-Advanced/SpellIt-App.md) | A twist on the classic Speak N Spell game | 3-Advanced | | [Spell-It App](./Projects/3-Advanced/SpellIt-App.md) | A twist on the classic Speak N Spell game | 3-Advanced |
| [Survey App](./Projects/3-Advanced/Survey-App.md) | Define, conduct, and view a survey | 3-Advanced | | [Survey App](./Projects/3-Advanced/Survey-App.md) | Define, conduct, and view a survey | 3-Advanced |
| [Change SVG image Color App](./Projects/3-Advanced/Change-SVG-Image-Color-App.md) | Define, conduct, and view a survey | 3-Advanced |
## Plans for the future ## Plans for the future

Write Preview
Loading…
Cancel
Save