DEV Community

Cover image for Artworks for the DigitalOcean App Platform Hackathon
Alba Silvente Fuentes
Alba Silvente Fuentes

Posted on

9 4

Artworks for the DigitalOcean App Platform Hackathon

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 ✨🥔

AWS Security LIVE!

Tune in for AWS Security LIVE!

Join AWS Security LIVE! for expert insights and actionable tips to protect your organization and keep security teams prepared.

Learn More

Top comments (1)

Collapse
 
scrabill profile image
Shannon Crabill

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

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay