Redesigned a full stack software developer’s personal website to modernize overall look and feel and generate new leads

Website Redesign

Role

Web Designer

Team Size

1

Duration

10 hours (plus 2 client meetings)

Squarespace, Figma

Tools

Background

Client

A highly experienced full stack developer

Task

Redesign service website to update look and drive traffic

  • Show all experience and services offered

  • Keep site’s easy navigability

  • Redesign logo

Requirements

Pain Points

  • Experience section is just long list of words

  • Photos are low quality and not specific to client

  • Lacks reviews from satisfied customers

The original wordmark “Poundtech” was difficult to read and felt closer to a band name logo than one for a professional services website. And the logo, a stylized pound symbol, is ubiquitous now as a hashtag, and more closely associated with social media than the services the client provides.

Logos

Services

The services section had interactive elements and was organized well, but had a very generic, outdated look. There is nothing about it that sticks in the user’s mind.

Customers

Similar to the Services page, the Customers page had some interactivity but insufficient descriptions of the work performed and the photos were not in the correct aspect ratios.

Contact

Finally, the Contact section uses a stock photo of the Austin skyline which does not specifically relate to the services performed. Overall the website felt impersonal, outdated, and ineffective for generating new business.

About

To start, I added an introductory or “About” Section in order to properly introduce the user to the client. This section is intended to give a general overview of the client’s background and experience while also personalizing things with a photo. Finally, I added logos of the many programming languages that the client uses, which is intended to be informational and to add a bit more color diversity.

I first tried a play on the original hashtag logo, but eventually realized that it does not relate well to the client’s services or overall purposes for this site.

After searching images and icons associated with software development, I kept finding the “gear” symbol. The gear symbol is used to represent important characteristics of developers, namely fluid thought processing and hard work.

Eventually I combined the gear symbol with the “P” in Poundtech and found a highly readable, sans-serif font to complete it. The new logo was born!

Using Squarespace, I updated the “Services” section with a large, more prominent typeface while still maintaining the previous design’s interactivity. However, when the user hovers over the new design’s cards (as shown in the video below), the illustrative background photos move and darken for better readability.

Services

Clients

The “Clients” section original interactivity was also minimal, but I did want to maintain that experience for the user. For greater accessibility, I increased the size of the customer logos, included a small description area, as well as linkable buttons if any user would like to see the finished products for themselves.

Contact

The last part of this main section was perhaps the most important of the entire page, the “Contact” section. As you will see in the final design, I included a prominent CTA in the header of the main page entitled “CONTACT” so users can quickly find this section. I also titled the section “Let’s Work Together” instead of “Contact” in order to convey a warmer, more inviting tone. Finally, the background photo shows that this company is proudly based in the vibrant and well known tech hub Austin, TX.

While my redesign addressed a lot of the client’s original requirements, I found some crucial missing components that, if added, would help drive more business his way.

In my first presentation to the client, I showed him these recommendations. He clarified some important details and asked for further changes. I have shown both my recommendations and his requests below.

My Recommendations

Sally Jones

Head Developer

Photo

As previously mentioned, a hi resolution photo of the client would personalize him more to potential customers. The client agreed that the site needs a personal photo, but does not want a large photo of himself, as I initially suggested. He clarified why below (see Team Member Links).

Reviews

Positive reviews from satisfied customers go a long way to validating your work and helping new customers make their final decision. The client also agreed with this suggestion .

Finally, I also suggested the client add his full resume and/or a link to his LinkedIn page for verification, networking purposes. The client agreed that he needs to add either one of these elements.

Resume

Client Requests

Pervez Sandahar

Designer

Team Member Links

Contrary to my initial understanding, the client envisions “Poundtech” as a company with multiple team members in the future. For this reason, he would like an About section with linkable cards for different team members, not just information about his professional bona fides.

Logo

The client would like a logo with more of an “industrial” gear look to more accurately evoke his personal aesthetic.

I had one final meeting with the client where he approved my recommendations and the changes I implemented based on his requests. And while Squarespace proved useful for presentation purposes, the client preferred to host the site himself. Therefore, I created a prototyped Figma file that he could then obtain the code from, which I have linked to below.

The client wanted a more realistic looking “gear” symbol. In the full logo, I also incorporated the font from the website and a more detailed description of the services offered, however the logo works as just a symbol as well.

He also wanted to move “All Services” above the “About” section in the scroll order because it outlines the primary functions of the business and he wants any potential customer to see that first.

As per his request, I expanded the “About Me” section to included linkable cards with other team member names and position titles.

The reviews section is an autonomously moving carousel which shows potential customers how satisfied others have been with the company’s work.

Finally, in the “Contact” section I added linkable icons to their social media pages for potential customers to get more information and establish trust.

Overall the client was incredibly pleased with this complete overhaul of his website. Stay tuned for traffic and conversion metrics after the site is launched!

CRAIGSLIST RESPONSIVE