Back to All Projects
Project Showcase

Okiro Landing Page

Okiro Landing Page

Technologies & Tools Used

React JSStyled Components

Project Overview & Features

This is a modern and responsive landing page UI built using React and Tailwind CSS, focused on clean design, smooth layout structure, and visually appealing presentation. The project demonstrates strong frontend development fundamentals with attention to spacing, typography, and component-based structure. It is designed as a creative landing experience suitable for showcasing products or digital services.


Key Features:

  1. Modern UI Design Clean and minimal landing page layout with strong visual hierarchy.
  2. React-Based Structure Built with reusable components for better scalability and maintainability.
  3. Tailwind CSS Styling Utility-first styling for fast development and responsive design.
  4. Responsive Layout Fully optimized for mobile, tablet, and desktop devices.
  5. Smooth UI Experience Clean spacing, typography, and layout flow for better user engagement. Performance-Focused Frontend Lightweight structure ensuring fast loading and smooth rendering.
  6. Reusable Design System Organized UI structure that can be reused for future landing pages.
  7. Real-World Landing Page Concept Suitable for product, service, or startup showcase websites.
Explore More

Other Featured Projects

View All Projects
Nofar  Webflow Website Design Improvements & Development
Featured

Nofar Webflow Website Design Improvements & Development

<h2>Project Overview</h2><p><br></p><p>I worked on <strong>4 pages</strong> of the Nofar website based on a template and content provided by the client.</p><p>The client shared a website template along with a <strong>Google Docs file containing the required content and information</strong>. My job was to take that content, build it properly in Webflow, and improve the design where needed.</p><p><br></p><p>I also made several major design fixes and improvements to make the pages look cleaner, more modern, and more consistent with the overall website style.</p><p><br></p><h3>What I Worked On</h3><ul><li>Built and updated <strong>4 website pages in Webflow</strong>.</li><li>Converted the content from the client's Google Docs file into the website.</li><li>Followed the provided template while improving the overall design.</li><li>Fixed several major design and layout issues.</li><li>Improved spacing, typography, sections, and visual consistency.</li><li>Made the pages responsive for different screen sizes.</li><li>Used <strong>Webflow and JavaScript</strong> for the development and custom functionality.</li><li>Focused on creating a clean and professional final result.</li><li>Worked closely with the client's requirements and feedback throughout the project.</li></ul><h3><br></h3><h3>Client Feedback</h3><p>The client was very happy with the final result and appreciated the design improvements and the way the provided content was turned into a polished website.</p><p><br></p><p>I maintained clear communication with the client, understood the requirements from the template and Google Docs file, and made the necessary changes based on their feedback.</p><p><br></p><p>The client was satisfied with the final design, development quality, attention to detail, and communication throughout the project.</p><p><br></p><p>As a result, the client gave me a <strong>5-star rating and positive feedback</strong> for the project.</p><p><br></p><h3>Final Result</h3><p>The final result was a cleaner, more polished, and responsive Webflow website with improved designs across the 4 pages.</p><p><br></p><p>This project shows my ability to take a <strong>client-provided template and content</strong>, improve the design, fix major issues, and turn everything into a professional Webflow website using <strong>Webflow and JavaScript</strong>.</p>

WebflowJavascriptCSS3
Hardgainer Pixel-Perfect Webflow Website
Featured

Hardgainer Pixel-Perfect Webflow Website

<h2>Project Overview</h2><p><br></p><p>I built this website for a client who wanted a website based on an existing reference website.</p><p>The client provided me with the original HTML file and a reference website. My job was to understand the existing design, structure, and layout, and then recreate the website in <strong>Webflow</strong> with a clean and pixel-perfect result.</p><p><br></p><p>I carefully worked on the layout, spacing, typography, colors, sections, buttons, and responsive behavior to make sure the final website looked very close to the reference.</p><p><br></p><h3>What I Worked On</h3><ul><li>Built the complete website using <strong>Webflow</strong>.</li><li>Recreated the design with a <strong>pixel-perfect approach</strong>.</li><li>Used <strong>Finsweet Attributes</strong> for additional functionality.</li><li>Converted the provided HTML/reference concept into a clean Webflow website.</li><li>Carefully matched the original layout, spacing, typography, and visual style.</li><li>Created responsive layouts for different screen sizes.</li><li>Paid close attention to small design details and overall consistency.</li><li>Made sure the final website was clean, professional, and easy to use.</li></ul><p><br></p><h3>Client Experience</h3><p>Communication was an important part of this project. I regularly discussed the requirements with the client, understood what they wanted from the reference website, and made changes based on their feedback.</p><p><br></p><p>Throughout the project, I focused not only on writing clean Webflow code and building the design, but also on making sure the client was happy with every important part of the website.</p><p>The client really liked the final result and was very happy with how the website looked compared to the reference they provided.</p><p><br></p><p>Because of the overall quality of the work, attention to detail, communication, responsiveness, and successful delivery, the client gave me a <strong>5-star rating and positive feedback</strong>.</p><p><br></p><h3>Final Result</h3><p>The final website successfully turned the client's reference and HTML concept into a polished, responsive, and <strong>pixel-perfect Webflow website</strong>.</p><p><br></p><p>This project shows my ability to understand an existing website or reference, recreate it accurately in Webflow, and work closely with a client to deliver a result they are genuinely happy with.</p>

WebflowJavascriptFinsweet
Simmark Pixel-Perfect Webflow Website with Custom Animations
Featured

Simmark Pixel-Perfect Webflow Website with Custom Animations

<h2>Project Overview</h2><p><br></p><p>A pixel-perfect Webflow website developed for <strong>Simmark</strong>, a UGC platform connecting brands with creators.</p><p>The entire website was built in Webflow with a strong focus on matching the client's design vision, maintaining visual accuracy, and creating the exact interactive experience they were looking for.</p><p><br></p><h3>What I Built</h3><ul><li>🎨 <strong>Pixel-Perfect Webflow Development</strong> — Carefully translated the design into Webflow with close attention to layout, spacing, typography, colors, and visual details.</li><li>⚡ <strong>GSAP Animations</strong> — Added custom GSAP animations to create smooth and engaging interactions throughout the website.</li><li>✨ <strong>Webflow Native Animations</strong> — Used Webflow's native interactions where they were the best fit for performance and maintainability.</li><li>🧩 <strong>Custom JavaScript</strong> — Implemented custom JavaScript functionality for interactions that required more flexibility than Webflow's native features.</li><li>🎬 <strong>Client-Specific Animations</strong> — Developed custom animations based on the client's requirements and feedback to achieve the intended visual experience.</li><li>📱 <strong>Responsive Development</strong> — Ensured the website remained visually consistent and functional across different screen sizes.</li><li>🎯 <strong>Pixel-Perfect Execution</strong> — Focused on reproducing the original design as accurately as possible while maintaining a clean and scalable Webflow structure.</li></ul><p><br></p><h3>Client Experience &amp; 5-Star Feedback</h3><p>This project was not only about building the website, but also about delivering a smooth and professional client experience throughout the entire process.</p><p><br></p><p>I maintained clear communication with the client, carefully understood their requirements, discussed design and animation expectations, and continuously incorporated their feedback during development.</p><p><br></p><p>The client was particularly happy with how closely the final website matched their vision, as well as the quality of the animations, interactions, responsiveness, and overall attention to detail.</p><p>As a result, the client gave the project a <strong>5-star rating and positive feedback</strong>, recognizing the quality of the work, communication, responsiveness, and successful execution of the project requirements.</p><p><br></p><h3>Result</h3><p>The final result is a polished, interactive, and pixel-perfect Webflow website that combines <strong>Webflow, GSAP, native Webflow interactions, and custom JavaScript</strong> to deliver the experience the client envisioned.</p><p><br></p><p>This project showcases my ability to take a detailed design and client requirements and turn them into a <strong>production-ready Webflow website while maintaining strong communication and a high level of attention to detail throughout the project.</strong></p>

WebflowGsapJavascript