Not every animation needs to shout.
Sometimes a simple object, moving gently with the scroll, is enough to make a page feel memorable.
Crafted with GSAP ScrollTrigger.
Maison Belle — Elegant Salon & Beauty Website Design 🌸
An elegant, modern salon website concept created to showcase how a beauty business can present its services and brand through a polished online experience.
Designed by Ubaid Web Studio, this project features a soft, luxurious color palette, refined typography, and a stylish layout inspired by the beauty and aesthetics industry.
✨ Key Features
Elegant UI Design: A sophisticated visual style with soft colors and modern typography.
Beauty Services: Sections for presenting salon treatments and services.
Service Pricing: A clear layout for showcasing sample service prices.
Team Profiles: Space to introduce beauty professionals.
Contact & Booking Sections: Convenient ways for visitors to explore contact and booking information.
Responsive Design: Designed for browsing on desktop and mobile devices.
🎯 Project Goal
To demonstrate how thoughtful web design can help salons present their services, communicate their brand identity, and create a welcoming first impression for potential customers.
Project Type: Salon Website Design & Development Demo
Demo Website: https://masionbelleastheticbyubaidwebstudio.netlify.app/
Note: Maison Belle is a demonstration project created to showcase my web design and development skills. It is not a commissioned client project.
1
407
Built a dynamic multi-viewport editorial design showcase in Figma, brought to life through custom JavaScript and CSS animation pipelines with high-fidelity FFmpeg rendering to explore spatial hierarchy in UX research.
2
193
Description
Pro Productivity is a Chrome extension designed to help users understand and improve their online habits. The extension automatically tracks the time spent on each website, providing detailed insights into daily browsing behavior. Users can create tasks, set focus timers, and receive reminders to stay productive throughout the day.
The extension features real-time website activity tracking, task management, focus alarms, and productivity analytics in a clean and intuitive interface. By visualizing browsing patterns and tracking task progress, users can identify distractions, manage their time more effectively, and build better productivity habits.
Key Features
✅ Website Time Tracking
Automatically tracks time spent on every website.
Displays real-time browsing activity.
✅ Task Management
Create and manage productivity tasks.
Monitor active and completed tasks.
✅ Focus Timers & Alarms
Set custom focus sessions.
Receive alerts when task timers expire.
✅ Activity Dashboard
View browsing history and usage statistics.
Analyze productivity trends over time.
✅ Clean User Interface
Modern dark-themed design.
Easy-to-use and distraction-free experience.
Technologies Used
React
WXT Framework
JavaScript
Chrome Extension APIs
Local Storage
HTML5
CSS3
Problem Solved
Many users underestimate how much time they spend online. Pro Productivity provides clear visibility into browsing habits while helping users stay focused on important tasks through time tracking and smart reminders.
Results
The extension enables users to:
Track online activity accurately.
Reduce distractions.
Improve time management.
Increase productivity through focused work sessions.
Gain valuable insights into their daily digital behavior.
Role: Full-Stack Chrome Extension Developer
Project Type: Productivity & Time Management Tool
Platform: Google Chrome Extension
1
58
Showcasing my recent work, KO1HQ website. It’s designed with a focus on modern aesthetics, smooth performance, and a user-friendly experience.
Interested in upgrading your site? Let’s connect and get started.
#Webflow #WebflowDesign #WebDesign #UserExperience #WebsiteShowcase #DesignWithPurpose #BrandGrowth
1
65
Kurstadt Taxi – Car Booking System | German Client
0
103
Savora — Food Delivery Landing Page
Designed and developed "Savora," a modern food-delivery landing page concept, built with HTML, CSS, and JavaScript, using GSAP for scroll-triggered and interactive animations.
Key features:
Animated hero section — a 3D-style orbiting animation where signature dishes (pasta, soup, salad, dessert) circle a central hero plate, complete with layered steam/smoke effects and floating particles for a premium, cinematic feel
Scroll-triggered reveal animations throughout the page using GSAP, giving each section a smooth fade/slide-in effect as the user scrolls
Interactive Sign In / Sign Up modal with tabbed switching between forms, styled input fields (name, email, password with show/hide toggle, address, phone), a consent checkbox, and smooth open/close transitions
Horizontal Menu Grid carousel — food item cards with images, titles, descriptions, and cart icons, complete with hover states and pagination dots
Promotional "Stats & Download" section with a call-to-action button, styled to match the overall dark/gold brand palette
Fully responsive layout with a cohesive dark-brown and gold color scheme designed to feel premium and appetite-appealing
Got a project in mind? Let's build it — message me anytime.
13-Week Cash Flow Forecast: Will Your Cash Last?
Plenty of profitable businesses still run out of cash. Customers pay late, a big stock order lands in the wrong week, and suddenly the bank balance is the problem, not the profit.
This forecast shows it coming, week by week, for the next 13 weeks.
Set your opening cash, sales, growth, costs and ad spend, and choose how quickly customers pay you. The dashboard draws your cash balance week by week, marks the lowest point, and tells you in one plain-English sentence whether you’re safe or heading below zero.
It’s a simplified demo with sample data. For a real business I build the forecast around your own sales, payment terms and costs, in the format your bank or investor expects.
If you’d like a cash flow forecast for your numbers, send me a message.
0
66
TopOneFuture – Corporate Website
Developed a modern corporate website aimed at presenting services in a clear, structured, and professional way.
Focused on performance, responsiveness, and clean UI to enhance user engagement. Built scalable frontend architecture to support future business expansion and feature integration.
Tech Stack: Webflow
1
164
[https://coffeechatboot.netlify.app/ demo link]
AI Coffee Shop Chatbot — Smart Customer Experience
Developed a modern coffee shop website featuring an AI-powered chatbot designed to improve customer interaction and make coffee shop information easily accessible.
The project combines an attractive coffee-themed interface with an intelligent conversational experience, allowing users to interact with the chatbot and explore coffee shop offerings through a simple, user-friendly interface.
Key Features
AI-powered conversational chatbot
Interactive chat interface
Coffee shop menu and product information
Automated responses to customer questions
User-friendly website design
Modern, responsive interface
AI integration for an enhanced customer experience
Project Type: AI Chatbot & Web Development
Focus Areas: Conversational AI, Chatbot Integration, Front-End Development, User Experience Design