Buttons: A Crucial Component to Web & App Design

Buttons: An Important Component of App & Web Design

Buttons, an element we use almost every day, often goes unnoticed as their usage is almost second nature.

They are, however, vital in creating positive and productive user experiences. In the Spruced App, an app that connects local professionals with clients, I aimed to create buttons that grabbed the user’s attention and allowed for a simple and intuitive user journey. 

For a button to be successful, it must be easily identifiable, while clearly indicating the action a user can complete. For the Spruced App, our goal was to facilitate the process of booking services via a mobile app. In doing so, it’s important to have buttons to help guide that process. My first goal in achieving this was to make buttons that look like buttons. Users need to know instantly what is clickable, or in this case ‘tappable’,  and what isn’t. I decided to use familiar designs such as rounded corners and maintained that design throughout the entirety of the app. Consistency improves speed and accuracy, and that is what’s needed to keep the user engaged and ensure the completion of the desired task.

“Consistency is one of the most powerful usability principles: when things always behave the same, users don’t have to worry about what will happen.” — Jakob Nielsen

In this example, I went with a rounded, wide button. Rounded corners are said to be modern, simple, and easier on the eyes, allowing for a more pleasant experience. 

While wide buttons are easier to spot, and more importantly, easier to tap. Properly sizing your buttons and making them finger-friendly are important when designing for apps. You want to ensure that your user has no mishaps and uncertainty when called to action. 

In addition to that, designing a button with a contrasting color to the surrounding elements is also vital. I chose a darker green because it’s much easier to see and stands out against the background. 

For here, I chose a toggle button. Toggle buttons are useful when the user is expected to turn a feature on or off.  

Different colors represent the current state of the button. A grey color often is representative of a button that is disabled or turned ‘off’. I kept with the green coloring of the previous buttons to determine an active or ‘on’ state.  

Differentiating between different states is very important in creating clarity with the user.

As you can see, buttons are extremely pertinent to the success of a user journey. Without them, you will not be able to make choices or complete actions. Try to aim for a button that is familiar, properly sized, and consistent with the overall aesthetic of your design.

Ready to push some buttons together?

Procept Marketing specializes in progressive web applications & App development. Let's chat!

The Secret Behind Over 130 Year of Success

Johnson & Johnson's Marketing Strategy Sucess

A staple in most US households, Johnson & Johnson has been in business for an impressive 134 years. Regularly ranked in the Forbes Top 500 (and often ranked in Forbes Top 100, too), Johnson and Johnson is arguably one of the most respected brands in their market. So how do they continue to maintain longevity?

The History of Johnson and Johnson

In 1886, the pharmacist Robert Wood Johnson formed a new company with his brothers James Wood Johnson and Edward Mead Johnson. The brothers founded their company based on Joseph Lister’s then-recent research into the nature of airborne germs and infectious disease.

In 1886, the pharmacist Robert Wood Johnson formed a new company with his brothers James Wood Johnson and Edward Mead Johnson. The brothers founded their company based on Joseph Lister’s then-recent research into the nature of airborne germs and infectious disease.

Early Development

Once established, Johnson & Johnson built a reputation for creating improved, mass produced versions of common health care and sanitation products. Their timeline includes:

  • 1886 – The Johnson brothers found their company based on the discoveries of Joseph Lister.
  • 1887 – Johnson & Johnson is formally incorporated.
  • 1888 – The company produces its first two products: a mainstream manual on treating injuries and the first mass-market first-aid kit.
  • 1894 – Johnson & Johnson begins its line of maternity and infant-care products, a brand which continues to identify the company to this day.
  • 1921 – The company releases one of its most enduring products: the Band-Aid.
  • 1931 – Johnson & Johnson releases America’s first prescription contraceptive.
  • 1944 – The company goes public.
  • 1959 – With the acquisition of two research laboratories, Johnson & Johnson fully enters the pharmaceutical business. Its first product quickly becomes one of its flagships: an over-the-counter pain reliever called Tylenol.
  • 1982 – Johnson & Johnson helps the FDA to develop the tamper-resistant pill bottle.
  • 1994 – Johnson & Johnson invents the coronary stent, changing the modern approach to cardiology.
  • 2006 – The company acquires Pfizer PFE Consumer Healthcare, bringing its history full circle as Joseph Lister’s Listerine product comes under Johnson & Johnson’s umbrella. 

Over the course of the 1930s, 1940s and 1950s, Johnson & Johnson developed the corporate structure that it still uses today. Then-chief executive Robert Wood Johnson II turned the one company into a decentralized family of companies, all operating under the Johnson & Johnson corporation. Each different unit specializes in different aspects of its business, such as Surgikos’ specialty in surgical packs and Ethicon’s line of suture products.

The Evolution of the Johnson and Johnson Brand.

Johnson and Johnson recently adopted a “social-first” strategy, meaning that each campaign begins with social media in mind. Longer ads intended for other platforms are a secondary consideration built to compliment the messages displayed on social media. This allows them to reach consumers quickly and efficiently, while staying relevant for their customers. (Global Marketing Professor)

Our brains are hardwired to respond to stories. Storytelling has been rooted in human nature since the dawn of humanity. As society and technologies change, companies recognize the value of investing in developing the complex art of brand storytelling as a part of their content marketing.

“It’s not what we want to talk about; it’s what the world wants to hear.”

When Johnson and Johnson launched extended parental leave for their employees across the organization, they treated the announcement like a product launch. To bring their stories to life, they reached out to all departments and focused on people’s stories.

Johnson and Johnson has long supported nurses and launched a campaign on social media called “Donate a photo.” For every photo, the company donated $1 to help train nurses globally. 

How to Apply Johnson and Johnson's Successful Strategies to Your Own Business
  1. Use storytelling Add a human element to your brand to create a deeper, emotional connection with your audience.
  2. Support your staff and don’t be afraid to talk about it.
  3. Adopt a strong social media campaign to showcase your message to your audience quickly.
  4. Stay invested in current events & causes This allows you to remain rooted in your community