DEV Community

Cover image for Daily UI Design Challenge: Day 5 – Elevate Your UI Design Skills
Johnny Santamaria
Johnny Santamaria

Posted on

Daily UI Design Challenge: Day 5 – Elevate Your UI Design Skills

From:
Daily UI

--

Embarking on the Daily UI 100-Day Design Challenge is an exciting way to sharpen UI/UX design skills and build an impressive portfolio. Now on Day 4, the focus intensifies on creating an app icon to highlight the face of a brand.

Description:

Design an app icon. What best represents the brand or product? Or is it incredibly unique? Does it look great at a distance and does it stand out when put on your home screen alongside other apps?

--

The design:

Daily UI Day 5 design

Colors: #000000 | #EBFF00 | #D9D9D9 | #3500A7

Description: The app's mission is to preserve and promote the skill of Morse code as a versatile, accessible, and timeless form of communication. By teaching users this historical language, the app empowers individuals with a unique tool for emergency signaling, inclusivity, and cognitive growth.

Why Morse code?

Morse code is a universal and timeless communication tool that transcends language barriers, relying on simple patterns of dots and dashes. It is invaluable for emergency signaling, enabling messages to be conveyed through flashing lights, sounds, or taps when other methods fail. Beyond its practicality, Morse code fosters inclusivity by serving as an alternative communication method for individuals with mobility or speech disabilities. Learning it enhances cognitive skills like focus, memory, and problem-solving, while preserving a historical skill that laid the foundation for modern telecommunications. Additionally, its minimal requirements make it an essential survival tool in disaster or remote situations.

--

What dictated my design choice?

  1. Simplicity and Clarity: The design ensures the icon is easy to recognize at a glance and stands out among other apps. The minimalist approach focuses on the core concept of Morse code without unnecessary elements, reflecting the straightforward nature of this communication method.

  2. Symbolism of Dots and Dashes: The use of Morse code itself as a visual element represents the app's primary purpose. The dots and dashes symbolize communication and are essential for users to instantly associate the icon with learning Morse code.

  3. Color Palette: The colors were chosen for their impact and meaning

Black represents the historical origins of Morse code in low-light, signal-based communication.

Yellow is a vibrant and attention-grabbing color symbolizes light and signals, making the icon visually appealing and relevant to emergency use.

Gray with its Neutral tones provide balance, emphasizing clarity and accessibility.

Purple adds a modern and innovative touch to appeal to contemporary users.

  1. Relevance to Accessibility and Inclusivity: The design integrates universal symbols that resonate with both experienced users and beginners. Its clean layout ensures it is accessible to people with various abilities, aligning with the app’s mission of inclusivity.

  2. Versatility and Functionality: The icon is designed to maintain its visual integrity at different sizes and resolutions, ensuring it looks great on both small and large screens. Its bold contrast helps it stand out on home screens without overwhelming other app icons.

Conclusion

The app icon embodies the essence of Morse code as a tool for communication, accessibility, and learning. By combining simplicity, symbolism, and a thoughtful color palette, the design effectively highlights the app's mission to preserve and promote Morse code. It stands out as a unique, functional, and visually appealing representation of the brand, inviting users to engage with this timeless skill.

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)

Cloudinary image

Video API: manage, encode, and optimize for any device, channel or network condition. Deliver branded video experiences in minutes and get deep engagement insights.

Learn more

👋 Kindness is contagious

Immerse yourself in a wealth of knowledge with this piece, supported by the inclusive DEV Community—every developer, no matter where they are in their journey, is invited to contribute to our collective wisdom.

A simple “thank you” goes a long way—express your gratitude below in the comments!

Gathering insights enriches our journey on DEV and fortifies our community ties. Did you find this article valuable? Taking a moment to thank the author can have a significant impact.

Okay