Home Page Redesign

I redesigned Alfa Concrete Walls' home page for stronger product focus.

Home Page Redesign

I redesigned Alfa Concrete Walls' home page for stronger product focus.

Home Page Redesign

I redesigned Alfa Concrete Walls' home page for stronger product focus.

Role

Role

UX Designer (Solo Project)

UX Designer (Solo Project)

Duration

Duration

1 Week

1 Week

Tools

Tools

Figma

Figma

The Problem

The Problem

Alfa Concrete Walls is a legitimate, established South African business with a real product and a real customer base. Despite this, its homepage communicates poorly, it buries its core offering under redundant information, cluttered navigation, and a layout that works against the user's natural reading flow. For a business where the product is entirely visual (precast walls) and trust is a primary purchase driver, a homepage that creates confusion rather than confidence is a meaningful problem.

Alfa Concrete Walls is a legitimate, established South African business with a real product and a real customer base. Despite this, its homepage communicates poorly, it buries its core offering under redundant information, cluttered navigation, and a layout that works against the user's natural reading flow. For a business where the product is entirely visual (precast walls) and trust is a primary purchase driver, a homepage that creates confusion rather than confidence is a meaningful problem.

The Audit: What Was Wrong

The Audit: What Was Wrong

I reviewed the homepage, section by section. I wanted to identify every element that added friction, created confusion, or failed to serve the user's primary goal of understanding what Alfa Concrete Walls offers and deciding whether to get in touch. The following issues were identified.

  1. Top Bar

  • A red announcement bar at the very top of the page displays the company's operating region (Gauteng) and a phone number. Both pieces of information were already present further down the page, in the hero section and the phone number is present in the hero and footer. The bar added visual noise at the first point of eye contact. I decided to remove it.

  1. Navigation Bar

  • This navigation is cluttered with too many options, several of which are redundant or irrelevant. Simplifying it would improve clarity and speed up decision-making.

  • “Home of precast concrete walls” can be shortened to “Home.” This removes unnecessary wording and follows standard navigation conventions.

  • “About” can remain after “Home.” Its placement is conventional and intuitive.

  • “Precast Wall Special Offer” can be renamed “Specials” and positioned after “Precast Walls.” Since “Precast Walls” contains the product dropdown, this structure would prioritises products.

  • “Stop Nonsense” can be removed as a standalone item and included within the “Precast Walls” dropdown. As a product type, it belongs under products rather than in the main navigation.

  • The “Price List” dropdown can be removed. Pricing is already accessible within individual product pages under “Precast Walls,” making a separate menu item is unnecessary.

  • “FAQ” can be removed from the main navigation and placed under “About" in the home page. This keeps the top-level navigation focused while still allowing access to supporting information.

  • “Blog” can be removed from the primary navigation. It already appears before the footer and is not a core user task. The primary purpose of the site is product discovery.

  • “Contact” can remain at the end of the navigation, maintaining a familiar and expected structure.

  • The search button can be removed. With a simplified and clearly structured navigation focused on products, search becomes redundant.

  • The “Get Quote” button can be removed because it leads to a contact page. Since “Contact” is already present, the button duplicates an existing function.

  • The primary focus of this revision is product visibility. The aim is to make products easy to find, remove distractions, and create a navigation system that is simple and quick to scan.

  1. Hero Section

  • The “Request a Quote” contact form can be removed, as its prominence contributes to visual clutter. A single “View our Services” CTA button can simplify the interface and lead users to the services, where they can request a quote for a specific service.

  • The contact number can be removed from this section to reduce clutter, especially since “Contact” is already available in the navigation.

  • A bold “Secure Precast Concrete Walls” title can be introduced to immediately capture attention, followed by a subtitle: “Manufactured and installed in Gauteng by experienced professionals”, to clearly communicate the services offered and their location.

  • Supporting information such as “45 years experience” and “5 years guarantee” can be positioned just before the CTA to strengthen credibility and reinforce trust at the point of action.

  • The background image can be changed to a front-facing product view that prioritises the walls without competing with the copy. Keeping a worker positioned at the edge of the frame maintains a sense of human presence while ensuring the product remains central.

  1. Unnamed Section

  • The section currently has no clear title and instead begins with “Precast Louver Walls starting at R650 p.meter,” which lacks context. A clear section heading would better orient users.

  • The section appears to function as an “About” section, but its length makes it demanding to read. It can be shortened and refocused to reduce cognitive load.

  • The “Cost Calculator” button can be removed, as it is misleading. The label suggests an instant pricing tool, yet it redirects users to a quote request form that still requires a response wait time.

  • The images in this section can be removed if each product is displayed individually elsewhere. This can keep the layout focused.

  • The “Send us WA for immediate assistance” sticky element can be removed. Because it follows users across the page, it constantly competes for attention and becomes distracting.

  • This section can be restructured as “Our Services,” where products are prioritised and presented in a clickable slider with navigation controls. This can elevate products, improve clarity and encourage interaction.

  1. Services Section

  • Each product can include a corresponding image to support customers who may not be familiar with different precast wall types. Visual cues help distinguish products more effectively than names alone.

  • The descriptions vary in tone and depth, offering no useful information. This section can still work without them.

  • Prices can also be added upfront for visibility and to speed up decision making.

  1. Another Unnamed Section

  1. Request Form

  • Removing this request form simplifies the page layout, reducing cognitive load and mostly focusing on products and brand identity for the home page.

  • The form can be placed in the "Contact" page.

  1. Blog Posts

  • The articles can be removed, as they feel misplaced and unrelated to the company or its offerings. One article even appears in a foreign language, which adds confusion.

  • Articles that are relevant to the company, its products, or its values can be included instead, ensuring content aligns with the site’s purpose and audience expectations.

  1. Footer

  • The footer is mostly fine, but the large phone number text can be removed. It is redundant since the number already appears under “Contact Info.”

  • The copy under the logo can be removed. If the homepage has effectively communicated the company’s value, additional trust-building copy here isn’t needed, as users are already ready to take action.

The Results

The Results

The Results

The Results

The Results

The Results

The Results

The Results

The Results

The Results

  • This is the second section that has no heading, despite functioning as an “About” section. A defined section title would better orient users and clarify its purpose.

  • The content is too long and demands too much time and attention.

  • This is the second section that has no heading, despite functioning as an “About” section. A defined section title would better orient users and clarify its purpose.

  • The content is too long and demands too much time and attention.

Desktop

Mobile

Mobile

After

Before

Before & After

Before & After

Takeaways

What I Learned

Working through this audit forced me to separate 'I don't like this' from 'this is not serving the user', and to be able to document the difference.

What I'd Do Differently

The most significant limitation of this project is the absence of any data about how users actually behave on the original site. Without analytics, I can't know which sections users spend time on and where they drop off. Some of my decisions could be wrong for this specific audience but I have no way of knowing. If I were working with the client directly, the first thing I'd ask for is six months of Google Analytics data before touching a single element of the design.

See more of my work

Re:Fit

I designed an online store that lets parents and teens buy or sell outgrown clothes, saving money and reducing waste.

Graduate Support

I designed a bank feature that enables young professionals to collectively save for the expenses associated with their job search and early career.

Re:Fit

I designed an online store that lets parents and teens buy or sell outgrown clothes, saving money and reducing waste.

Contact

© 2026 Mthokozisi Masondo


Contact

© 2026 Mthokozisi Masondo