DEV Community

loading...
Cover image for Artworks for the DigitalOcean App Platform Hackathon

Artworks for the DigitalOcean App Platform Hackathon

dawntraoz profile image Alba Silvente πŸ’ƒπŸΌ ・2 min read

In this article I want to show you the artwork I created for this month's DO Hackathon.

Idea - Potatizer

After reading the requirements and seeing the available categories, I had wanted to do a very stupid application related to potatoes for a long time, so I decided to choose as a category:

Random Roulette: Build a wacky app that doesn’t fit into one of the categories above. Looking for some truly silly and/or fun submissions.

Since the main objective was to have a few laughs and, why not, learn something new while doing it, I thought of creating an application to randomly generate your potato mood of the day.

Illustrator artworks

I started looking for emojis and potato memes for the application. As they didn't look like what I imagined, I decided to create my own with the help of Flaticon and my beloved Illustrator.

Potato emojis

The moods I have prepared for this first version are:

Potato emojis

  • Laughing
  • In love
  • Thug life
  • Eing
  • Crying
  • Sick
  • Angry
  • Sleepy
  • COVID mask

Potato background

To give the application a more childlike and fun look I have created this background

Potatoes background

and exporting it to svg, I have animated it by playing with opacities and transition begin time:

<animate attributeType="CSS" attributeName="opacity" dur="2.5s" repeatCount="indefinite" values="0.25;1;0.25" begin="2s" />
Enter fullscreen mode Exit fullscreen mode

The final result will be:

Background potatoes animated

SEO assets

Once the basic assets for our application were created, I decided to go ahead and have everything ready to share on social networks and to install the PWA on our device.

So I prepared the favicons for our app, choosing laughing emoji as the logo:

Icon potatizer

And a card to share on social networks:

Social media artwork

To be continued

In the next post, I will tell you about the progress I have been making in terms of the code, in which I am using NuxtJS with its PWA module and with the static SPA mode πŸŽ‡

I hope you find the result fun, because doing so is ✨πŸ₯”

Discussion

pic
Editor guide
Collapse
scrabill profile image
Shannon Crabill

Oh, this looks like fun I look forward to your next posts and seeing this go live.

Collapse
tomburgs profile image
Toms Burgmanis

Please never change, Amsterdammers.