DEV Community

Cover image for Hugo - sending hugs you really feel - First ideas
Nagy Szabolcs
Nagy Szabolcs

Posted on

4

Hugo - sending hugs you really feel - First ideas

If you ever wanted to send someone a hug online, you most likely have come across this gif. It's a cute and kind way of sending some love, but it lacks the feel part of a hug.
hug gif

This is where Hugo comes in place!

The idea behind it, is sending a hug that you can really feel.
How? you may ask, well it's simple, haptic feedback (more specifically vibration).
You can record a hug, and send it to your loved ones, then all they have to do, is place their phones on their chest, and feel your special hug! πŸ˜„

Well, let's get started! πŸš€

First of all, I started my project on paper, sketching and writing down ideas.
sketch of the design
🧠 I came up with an editor that's made out of toggleable boxes, each representing a step. These can be either a pause o or a vibration ~, and they also add up, meaning if you have the following pattern:
~ ~ o ~ ~ ~ the phone will vibrate for 2 seconds, pause for 1 then vibrate for 3 more.

πŸ›  I did not want to overcomplicate the layout, so it's really simple, being one column on mobile, and two on desktop.
Also, I usually build websites using Bootstrap, but I thought it would be overkill for this project, so I started looking for alternatives.

🌟 Somehow Tailwind popped up in my YouTube recommended, and I thought I'd give it a try. After watching this series by The Net Ninja I decided it would be fun to try it out! (I really encourage you to check out his videos if you're interested, they're great!)

Woho! you made it to the end!

This is my first ever post in here, so any kind of feedback is appreciated, take care, here's a hug! πŸ‘»
hug gif

Sentry blog image

Identify what makes your TTFB high so you can fix it

In the past few years in the web dev world, we’ve seen a significant push towards rendering our websites on the server. Doing so is better for SEO and performs better on low-powered devices, but one thing we had to sacrifice is TTFB.

Read more

Top comments (0)

Qodo Takeover

Introducing Qodo Gen 1.0: Transform Your Workflow with Agentic AI

Rather than just generating snippets, our agents understand your entire project context, can make decisions, use tools, and carry out tasks autonomously.

Read full post

πŸ‘‹ Kindness is contagious

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

Okay