GeorgeCiesinski / poke-guesser-bot

Discord bot that lets you guess pokemon
MIT License
0 stars 3 forks source link

Generate a PNG version of the leaderboard instead of using stock discord embed #40

Open GeorgeCiesinski opened 3 years ago

GeorgeCiesinski commented 3 years ago

Describe the new feature

Convert the leaderboard output code to generate a nice looking version of the leaderboard instead of using embed fields, and code blocks.

Describe alternatives you've considered

@Wissididom also considered using Canvas to generate the leaderboard. This should be compared against the html & svg examples here to see the pros/cons and select the most suitable method.

Design

The design needs to be work shopped. Currently, I'm imagining keeping the Champion, Elite Four, and Runnerups, but generating a beautiful looking leaderboard while maintaining these separate groups. Instead of only generating an image of the runnerups table, it would make more sense to do this for the whole leaderboard.

The theme could use pokemon colors, a minimalist aesthetic, and a hierarchical arrangement.

Useful links

  1. Blog post showing html/svg generation methods for embeds
  2. Embed visualization tool
NiceWaffel commented 3 years ago

I think a good starting point for the design "work shop" would be a simple prototype. index

See the fork https://github.com/NiceWaffel/poke-guesser-bot for a basic implemetation in js (generate_leaderboard.js). That implementation was also used to generate the image above.

GeorgeCiesinski commented 3 years ago

This looks really good. The only suggestion I have for this is to add some visual theming. Maybe a vector image of pokeballs, or something else pokemon themed.

Either way, it is only a suggestion so I'll leave it up to you!