UI / UX Design Practice Landing Page
Create a fully responsive modern landing page
I then gathered up my ideas and started creating sketches, laying out the information architecture to show where each UI elements should be placed for user friendly experience.
Finally, before developing the landing page I used Adobe XD to create low fidelity wireframes to confirm the design model of the project for both desktop and mobile.
- SVG animated logo created with Adobe Illustrator, Code Pen and Visual Studio Code.
- To make the website more dynamic I used animations from animate.css library to animate images
- popper.js for positioning HTML elements
- Font Awesome icons for high quality styling
- Bootstrap grid system for responsive design
- Creating fully responsive website design across multiple devices by applying Media Queries
Business professionals, UI / UX Designers looking to communicate their brand and gain credibility.
With user friendliness being the main objective in this project I decided to use a complementary color scheme with Aqua blue & turquoise being the most dominant colours as I really wanted to make the user feel peaceful, and also make it fun to scroll through the website.
One of the biggest challenges I faced in this project was using jQuery to create the effect on the social media icons fading in from the left and right. Also, it was very challenging to get the animations to initiate at certain points when the user scrolls down the page.