The Backspace

Personal Blog Website Design

H

Project Overview

The Project:

Design a personal blog for an universal website for software engineers. Dan Stough has been a software engineer for over 10 years and writes articles that relate to every day occurances or issues that arise in the software engineering world. His personal blog is a space for the community to read his articles and partake in constructive conversation

Project duration:

October 2023 - March 2024

The problem:

The Stakeholder was having trouble envisioning the design of their website. They could engineer the website and write the articles that would be published, but designing was blocking the creation of the website. Original Figma design lacked brand identity and overall user flow.

The goal:

Design The Backspace's website from the bare minimum design to a fully functioning website that clearly highlighted the Stakeholder's articles about software engineering and showcase the Stakeholder's brand identity.

From this to that:

BEFORE

AFTER

H

My role:

UX Designer designing a website for a Stakeholder's personal software engineering blog from conception to delivery

Responsibilities:

Conducting research, competitive audit, paper and digital wireframing, low and high-fidelity prototyping, iterating on designs, and logo design

Pain points:

1. Brand Identity

- Lacking in brand awareness which will reduce recognition and visibillity for potential new customers

2. Responsive Design

- Stakeholder is looking for a design that can easily transform to a responsive design as they are building the site and want to make it as easy as possible

H

WIREFRAME SKETCHES:

Homepage Options

Stakeholder was drawn to Option C for the Homepage. They liked the format of Option E for the blog pages and the About section on Option A for a separate About page.

Option A

Option B

Option C

Option D

Option E

H

LOW-FIDELITY PROTOTYPE

Using the completed set of digital wireframes, I created a low-fidelity prototype. The primary user flow I connected is starting from the homepage viewing the different blog posts available to read, reading a blog post, viewing a demo, and learning more about the Stakeholder, so the prototype could be viewed by the Stakeholder.

The Backspace Lo-Fi Prototype

HIGH-FIDELITY PROTOTYPE

The final high-fidelity prototype presented the Stakeholder's new brand identity. We also removed the option to sign up for an account. Once the Stakeholder has more time and more articles posted, then the feature might be brought back.

The Backspace Hi-Fi Prototype

H

TAKE AWAYS

I was brought onto this project by the Stakeholder because they were frustrated with how difficult they found it to visually design a website. I had a lot of fun diving into the world of software engineering blogs and found, after conducting a competative audit, that they are all quite boring! Working with the Stakeholder to design something that is visually appealing as well as easy to build was a fun challenge and helped me build a better rapport communicating with front-end software engineers.

The website design has been well received by the Stakeholder and is slowly being implemented onto a functional URL.

© 2023 Abi Maguire. All rights reserved.