PROJECT CONTEXT
Fresh approach to the website
Redesign of Code HussAR's website
Redesign of Code HussAR's logo
Timeline: January - Feburary 2021
Tool: Figma, Illustrator
Code HussAR is a software development team, which I am a part of. In early 2021 we decided that our website was a little out-dated and it needed an update. I immediately started working on the design. I had the freedom to redesign the entire website how I wanted and I let out my creative side :)
THE STYLE GUIDE
Keep it simple
I decided to keep the style guide simple. I went with one leading color, that was originally in the old design: red. But to make it more eye-pleasing and modern, I made gradients that are present all over the website.
LOGO
Changing logo to vectors
Our old logo was an illustration and had a lot of small elements. It was nice but it wasn't suitable for a logo.
We wanted to keep the idea of the logo, which was a heart and a symbol of wings that are characteristic of the Polish military formation. It was quite a challenge and I did over 6 versions of the logo but the final result is very satysfying and suits the feeling of the team well.
CHANGE BREAKDOWN
Making it clear
The old website was useful but it lacked the functional arrangement of components and information. And most important, it lacked the visual side.
The main visual changes were the Home, Our Expertise and Team sections.
I decided that Home section should take a whole screen size and it should be some kind of a business card of Code HussAR team. Home seciton is a purely visual part of the website.
Home Section
I changed the Our Expertise section to be more eye pleasing. I changed the icons and edited them to match colors. New design looks very clear and the wavy red elements are present, matching the website whole look. Icons are also more legible since they have less detail.
Our Expertise section
Team section was very simple but I wanted to make it more interesting. This way it is more pleasant for a user to scroll through our page. The red gradient background is a great break between the white sections of the website
Team section
The main problem in the old website was that the Projects section was too long. 8 projects were listed on the website and it was just too much scrolling. So I came up with the idea that projects will be presented in the form of a carusel. This way user will see that we are an experienced team without the need to scroll through all the projects.
Project section
Link to Code HussAR website here.
Link to full figma file here.
REFLECTIONS
Thoughts about this project
Overal, the final product turned out great, in my opinion. Now this website has a fresh look, with trendy gradients and wavy elements. It's clear, simple, with a lot of white space. It's a nice change that makes Code HussAR team more up to date with modern UI look.
The only problem is that the implemented website is a little different than the actual design. It's becasue we had a lot of different projects at the time and we didn't focus on one thing. So it's important to pay attention to little details like layout of the elements and even the distance between each components.
Thank you for reading!
If you want to contact me, please email me at:
a.pawelek.wwa@gmail.com