Brand Identity | UI Design
MHP: A Porsche Company – Website Redesign
I got the initial idea for this project when I found out I’d be receiving an interview from the company in question. At this stage in my career, I had a small history of bringing UX and UI Design principles and processes to other industries in a series of hybrid roles between instructional design, content management, and multimedia production. That hadn’t really been working for me, and I was inspired to “make the move to UX” full-time.
There was one problem: because all of my work has been for other companies, a lot of it is proprietary. Which means that I didn’t have the portfolio that other applicants to UX Design jobs certainly had.
Then, I got the email that I’d be interviewing with MHP. The very next day. I realized that I would need more to show them in the UX/UI Design space, and so picked a “low-hanging fruit” to redesign quickly, on the fly. This project end-to-end took about 14 hours and established a baseline that I needed: how much could I produce in a short window? While the results below aren’t perfect, I appreciate this project for teaching me the right way to start with the basics, and build fast.
Research
I began my research by looking at MHP’s websites, both global and USA-based, in an attempt to understand as much as I could about the company. Because I’d be working out of the US office, I determined that the USA site was an excellent candidate for a redesign to show off what I could do for them. Beyond that reason, it appeared to me that the old site was in desperate need of a redesign—which made it the perfect project for this interview.
I hashed out a design critique (which was NOT shared with them, but rather a method I use to pick off the most obvious targets for improvement) and got to work analyzing the market MHP competes in, comparing them to their consulting competitors, and beginning to ideate on the brand strategy for a new website.
Ideation & Basic Prototyping
At this point, I felt that I understood what MHP’s website wanted to do—it was just failing at doing it. MHP at its core is a small and highly specialized consulting business in the automotive space. Their entire business model is based around offering that “future-forward” expertise, so I wanted something that represented that: clean, elegant in its simplicity, and with a design that wouldn’t degrade over time.
Once I had a strategy, I ideated with terrible paper wireframes before moving to Sketch, as I wanted to make sure the layout and (especially) the typography chosen would translate well to the digital space.
My first digital attempt was okay, but not great. That being said, I really liked the way the layout was beginning to come together. It was, above all, simple—and I felt this change already gave it a sense of elegance and prestige. It obviously wasn’t there yet, but it was coming along.
I decided at this point that I need to add photography and begin putting together a proper mockup, as I also fixed some noted issues along the way.
Final Mockup
After a few rounds of iteration (and rapidly running out of time before my interview), I was satisfied with the final version. Mostly. It fit the brand identity, presented a more modern interface for a consulting company that brought it in line with its competitors, and was almost too easy to navigate. There are definitely minor problems with the “final” mockup that wouldn’t exist if I had more time— some alignments are a bit off, a few elements aren’t centered, the “contact us” link in the “MHP in Brief” section needs to be more obviously clickable, and I would follow more conventional web design patterns if I could do it over when it comes to the layout.
I’m a better designer now than I was when I did this project, and while I have better showcases in my portfolio, this one was the first I was proud of. I wanted to showcase it here because I still think it’s a beauty, warts and all.
I did not get the job.