Project Name: E-commerce Website for Electronic Store

Overview: I created a WordPress-based website that sells Products online. The website was responsive, and I used Elementor Pro for its development.

Technologies Used: WordPress, Elementor, WooCommerce, HTML, CSS, Photoshop

Challenges: I faced technical issues with online payment integration, which I solved by integrating the Stripe payment gateway.

Process: I explored the WooCommerce plugin to set up the online store and created wireframes to plan the layout. After installing WordPress, I customized a theme that matched the shoe store's branding and configured WooCommerce for product management, payments, and shipping. Using Elementor Pro, I designed a custom layout that included product pages and a seamless checkout process, and integrated the Stripe payment gateway to ensure secure transactions.

Learning: From this project, I gained knowledge about WordPress customization and payment gateway integration.

Live Link:https://ecommercesite.free.nf

Project Name: Butterfly

Overview: Butterfly is a web application designed to manage and store information across various departments, including branches, user management, transactions, and reports.

Technologies Used: HTML, CSS/SCSS/Tailwind, Bootstrap, Figma, Angular, Dot Net.

Challenges: Handling data structures for multiple modules in a single dashboard was challenging, along with maintaining a consistent design across screens. Responsive adjustments required extra focus for a smooth user experience.

Process: I began by understanding requirements, followed by creating wireframes and responsive UI designs in Figma and also created Figma designs as per client requirement

Learning: This project strengthened my skills in responsive UI design, data structure planning, and advanced Figma prototyping. It also provided hands-on experience with best practices in dashboard design.

Live Link:http://49.50.108.144:4200

Project Name: Live Dinner:

Overview: This project involved creating a visually appealing and user-friendly homepage for a restaurant website. The design focused on showcasing the restaurant's atmosphere, menu highlights, and food facilities, using placeholder text to create a professional layout that could easily be updated with real content.

Technologies Used: HTML, CSS, Bootstrap, Jquery

Challenges: Implementing a smooth and responsive image slider was a challenge, as it required adjustments for different screen sizes. Balancing visual appeal with functional responsiveness took multiple iterations, especially to avoid issues with image loading and formatting on various devices.

Process: I started by identifying key elements for the homepage such as the restaurant’s offerings, ambiance, and unique features and then created a wireframe to organize these elements logically. Next, I used HTML, CSS, and JavaScript to build the layout, ensuring the design was responsive across devices. An image slider was added to feature the restaurant’s top dishes and interior.

Learning: Through this project, I deepened my understanding of responsive design and learned techniques for creating smooth sliders using Jquery.

Project Name: Aquantuo

Overview: Aquantuo is an e-commerce-style platform focused on shipping products internationally, specifically designed for small businesses. The website provides users with an intuitive interface for booking shipments, tracking deliveries, and managing orders.

Technologies Used: HTML, CSS, Bootstrap, Jquery, Javascript, PHP, Laravel

Challenges: Designing and implementing the admin dashboard was one of the challenging aspects, as this was my first time creating a dashboard interface. Ensuring that the frontend matched the Figma mockups precisely and worked smoothly across devices required extra attention to detail.

Process: I designed the full UI for both the user-facing site and the admin dashboard, carefully ensuring each screen was responsive and aligned perfectly with the initial Figma designs. I built the frontend using HTML, CSS, and JavaScript, creating a clean, organized layout.

Learning: Through this project, I gained valuable experience in designing and developing complex dashboard interfaces. Working closely with Figma helped me improve my design-to-code skills, and I also deepened my understanding of responsive design for data-rich components.

Live Link:https://aquantuo.com

Project Name: Invozio

Overview: Invozio is an application that simplifies invoice creation and management. Users can input client details, product information, quantities, and prices, with automatic total calculations and discount applications. All invoices are stored in a central dashboard for easy access and organization.

Technologies Used: HTML, CSS, Bootstrap, Jquery, Javascript, React js.

Challenges: I faced challenges in making the slider responsive. Adjusting the design to work smoothly across various screen sizes required careful handling of layout and element scaling.

Process: I started by built the frontend with HTML, CSS, Bootstrap ensuring responsiveness for desktop, tablet, and mobile views. The core functionality involved setting up a streamlined process for generating, editing, and viewing invoices.

Learning: This project enhanced my skills in designing responsive dashboards and handling data-intensive components.

Live Link:https://invozio.com

Project Name: Organtic

Overview: The Organtic project features a dedicated to showcasing fresh fruits, highlighting their benefits and availability. The design aims to attract customers by presenting vibrant images and essential information about various fruit options.

Technologies Used: HTML, CSS, Bootstrap, Jquery.

Challenges: I encountered difficulties in implementing the slider, particularly in making it responsive. Ensuring that the slider displayed multiple items effectively while maintaining usability across devices required significant adjustments to the layout and functionality.

Process: I created a responsive design that adapts seamlessly to different screen sizes. The layout includes sections for featured fruits, their benefits, and an engaging slider displaying multiple items with detailed descriptions.

Learning: This project enhanced my skills in creating responsive designs and working with sliders, as well as improving my understanding of how to effectively present product information to engage users.

Project Name: Pablo

Overview: The Pablo project is a web application designed for booking various locations for events such as weddings and parties. It allows customers to choose venues according to their preferences, offering an intuitive interface for easy navigation and selection.

Technologies Used: HTML, CSS, Bootstrap, Angular, Dot Net.

Challenges: A significant challenge I encountered was making the stepper responsive. Ensuring that it functioned well on different screen sizes required careful adjustments to maintain usability while keeping the design visually appealing.

Process: I created the frontend designs with a focus on user experience, ensuring that the site is responsive across all devices. This included designing a clean layout for venue listings, detailed pages for each location, and a streamlined booking process. Additionally, I created responsive dashboard designs for administrators to manage bookings and venue information efficiently.

Learning: I improved my skills in creating a seamless booking process for clients and learned how to effectively handle responsive design challenges.

Live Link: https://stage.locationgenie.ae

Project Name: Volca

Overview: The Volca project is an e-commerce website dedicated to promoting the sale of safe and fresh drinking water products. The site aims to provide customers with easy access to quality water products while emphasizing health and safety.

Technologies Used: HTML, CSS, Bootstrap, React.js.

Challenges: I faced difficulties while implementing animations, striving to enhance the user interface without compromising the site’s responsiveness.

Process: I created the frontend designs with a focus on user experience, ensuring that the site is responsive across all devices. This included designing a clean layout for venue listings, detailed pages for each location, and a streamlined booking process. Additionally, I created responsive dashboard designs for administrators to manage bookings and venue information efficiently.

Learning: Through the Volca project, I learned how to effectively design an e-commerce platform, enhance user experience, and integrate essential features like payment gateways.

Project Name: E-commerce App Designs

Overview: The e-commerce app design project focused on creating a comprehensive mobile application that allows users to browse, search, and purchase products in various categories such as shirts, shoes, and jeans. The goal was to deliver an engaging and user-friendly shopping experience on mobile devices.

Challenges: During the design process, I encountered challenges in maintaining consistency across various screens while ensuring intuitive navigation. I also focused on making the user experience seamless, which involved carefully planning the layout and visual elements to guide users through the shopping process.

Process: I started by researching user needs and industry trends to inform the design process. Then, I created wireframes for the app's structure, followed by detailed UI designs in Figma. The app includes features such as product listings, a shopping cart, user profiles, and an order tracking system. I ensured that the design was responsive and optimized for different screen sizes, enhancing usability across devices.

Learning: It helped me refine my skills in Figma and taught me how to create visually appealing and functional app designs that cater to user preferences.

Figma Link:E-commerce App Designs