![](https://static.wixstatic.com/media/f77a35_16647e33079a4a998e5c977e301d4a06~mv2.png/v1/fill/w_976,h_548,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/f77a35_16647e33079a4a998e5c977e301d4a06~mv2.png)
Project Overview
About
Kryptos provides a range of services including software development, web development, mobile app development, cloud computing, and digital marketing. With more than fifteen years of experience under the belt, Kryptos is now a leading remote infrastructure management company for businesses all over the world.
Roles & Responsibilities
Worked as a UX Designer, researcher, creating paper and digital wireframes, low and high fidelity prototyping, conducting usability studies and iterating on designs.
Project Duration
6 weeks
The Problem
All the problems are with the current version are properly listed below.
-
The webpage was too cluttered
-
No clear navigation
-
Too many exit points
-
Outdated design and Typography
Goals
Understanding the problem statement and defining the objectives and goals of the website redesign
-
Declutter the landing page
-
Improve website navigation
-
Reduce the number of exit points
-
Upgrade the visual design
Design Process
I chose design thinking process for this project. Design thinking is a non-linear, iterative process that makes us to understand the users, define their problems and come up with solutions to prototype and test.
Empathize
Define
Ideate
Prototype
Test
User Research
I have collected some useful data with the help of third party tools like HotJar and Google analytics which were already implemented on the website.
​
I have studied the recordings, heatmaps, behaviour flows, site analytics and other metrics.
![](https://static.wixstatic.com/media/f77a35_e9fa005f8cb1463c8f62fb4dcb72854f~mv2.png/v1/fill/w_198,h_95,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/f77a35_e9fa005f8cb1463c8f62fb4dcb72854f~mv2.png)
![](https://static.wixstatic.com/media/f77a35_5a9eee9e2ee648afb6a3f8d70b38a255~mv2.png/v1/fill/w_287,h_161,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/f77a35_5a9eee9e2ee648afb6a3f8d70b38a255~mv2.png)
Information Architecture
![](https://static.wixstatic.com/media/f77a35_fe71e04ca911412893c3d694e5e92e39~mv2.png/v1/fill/w_586,h_781,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/f77a35_fe71e04ca911412893c3d694e5e92e39~mv2.png)
Lo-Fi Wireframes
I have created wireframes to understand the basic structure of the website to present content, information and basic layout before visual design. I mainly focused on creating clear and intuitive content structure that guides the user toward call to action.
![](https://static.wixstatic.com/media/f77a35_70bba3d5c71247939723f2037ee825c6~mv2.png/v1/fill/w_322,h_888,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/f77a35_70bba3d5c71247939723f2037ee825c6~mv2.png)
![](https://static.wixstatic.com/media/f77a35_863cc4fe92594a9ca0f36dcdd77d5c3f~mv2.png/v1/fill/w_90,h_879,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/f77a35_863cc4fe92594a9ca0f36dcdd77d5c3f~mv2.png)
![](https://static.wixstatic.com/media/f77a35_fe5f7d31dd4d49b59a0e60ea57a26af4~mv2.png/v1/fill/w_321,h_953,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/f77a35_fe5f7d31dd4d49b59a0e60ea57a26af4~mv2.png)
![](https://static.wixstatic.com/media/f77a35_c6992780590e4b91a0556879d73587db~mv2.png/v1/crop/x_0,y_4,w_390,h_3639/fill/w_99,h_924,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/f77a35_c6992780590e4b91a0556879d73587db~mv2.png)
Home Page
About Us Page
Style Guide
Colors
#F16A4A
#173D7A
#19313E
#5B5B5B
Typography
Poppins
A B C D E F G H I J K L M N O P Q R S T U V W X Y Z
a b c d e f g h i j k l m n o p q r s t u v w x y z
Hi-Fi Mockups
Landing Page
![](https://static.wixstatic.com/media/f77a35_5217e6bb780b4413bf59c76555e57807~mv2.jpg/v1/fill/w_812,h_2421,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/f77a35_5217e6bb780b4413bf59c76555e57807~mv2.jpg)
Mobile Mockups
![](https://static.wixstatic.com/media/f77a35_0b844d4601a44537bc2d9ecd2de6e251~mv2.png/v1/fill/w_972,h_599,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/f77a35_0b844d4601a44537bc2d9ecd2de6e251~mv2.png)
Hi-Fi Prototyping
![](https://static.wixstatic.com/media/f77a35_f2b3961ad585420cb8ae794ed1f73b9c~mv2.png/v1/fill/w_727,h_622,al_c,lg_1,q_90,enc_avif,quality_auto/f77a35_f2b3961ad585420cb8ae794ed1f73b9c~mv2.png)
Key takeaways and lessons
I have understood that a successful website redesign requires a clear understanding of user needs, effective communication and collaboration among team members, and a focus on delivering a seamless user experience.