AI CRM, Automation & Webflow Developer
- $10k+
- Earned
- 2x
- Hired
- 5.0
- Rating
- 29
- Followers
AI CRM, Automation & Webflow Developer
Digital Product Designer: Figma, Webflow, Framer & Kajabi
Digital Product Designer: Figma, Webflow, Framer & Kajabi
This project is a professional agency website designed and developed in Framer for Lamp Digital. The goal was to create a clean, modern, and responsive website that effectively showcases the agency’s identity, services, and expertise.
Using Framer, I crafted a visually balanced layout with strong section hierarchy, clear service descriptions, and engaging visual elements. The design emphasizes readability, brand presence, and smooth navigation to guide visitors toward key calls to action.
The site is fully responsive on desktop and mobile and includes clean typography, strategic spacing, and a modern aesthetic suitable for digital agencies and creative brands.
1
141
Web Developer | Motion developer | full stack engineer
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
Iron Core Fitness — Modern Gym Website Design 💪
A bold, modern gym website concept designed to showcase how a fitness business can build a strong and professional online presence.
Created by Ubaid Web Studio, this project combines a powerful dark theme, vibrant lime-green accents, and bold typography to deliver a fitness-focused visual experience.
Key Features
Bold Visual Design: A striking gym-inspired look with modern typography and colors.
Membership Plans: Clear presentation of membership options and pricing.
Fitness Programs: Dedicated sections to showcase training programs and services.
Trainer Profiles: Sections introducing trainers and their expertise.
Class Schedule: A structured view of fitness classes and timings.
Responsive Layout: Designed for a smooth browsing experience on desktop and mobile.
Contact & Join Sections: Clear pathways for visitors to explore membership and contact the gym.
Project Goal
To demonstrate how a well-designed website can help gyms present their services, communicate their brand, and make important information easier for potential members to find.
Project Type: Gym Website Design & Development Demo
Demo Website: https://ironcorefitness2.netlify.app/
Note: Iron Core Fitness is a demonstration project created to showcase my web design and development skills. It is not a commissioned client project.
1
274
BrightSmile Dental — Modern Dental Clinic Website Design 🦷
I designed this modern dental clinic website concept to demonstrate how a professional online presence can help dental clinics showcase their services and build trust with potential patients.
The design combines a clean, professional layout with a calming teal-and-white color palette to create a welcoming experience. It features dental services, dentist profiles, testimonials, frequently asked questions, and an appointment enquiry section.
Key Features
Modern UI/UX: Clean layout with a professional dental-care aesthetic.
Responsive Design: Designed to provide a smooth experience across desktop and mobile screens.
Service Showcase: Helps visitors explore dental treatments and services.
Trust-Focused Sections: Dentist profiles and testimonial sections create space for clinic information.
Appointment Enquiry: A clear section for visitors interested in contacting the clinic.
My Goal
To demonstrate how thoughtful web design can make a dental clinic's information easier to explore and help potential patients take the next step toward contacting the clinic.
Project Type: Dental Website Concept / Portfolio Demo
Note: BrightSmile Dental is a demonstration project created to showcase my web design and development skills. It is not a commissioned client project.
1
203
Title: Nexa Electronics: Premium E-Commerce Website with Interactive 3D Exploded Views
Description:
Nexa Electronics is a demo e-commerce website I designed and built to show my skills in modern web design, front-end development and interactive 3D experiences. This video is a walkthrough of the site.
What’s in the vedio.
The home page, with a cinematic hero section and a 3D device showcase
Browsing by category: Smartphones, Laptops, Audio, Gaming, Smartwatches, Smart Home and Accessories
Product pages with configuration and colour options, a zoom inspection view, pricing, stock status and customer reviews
The interactive 3D exploded view (“Explore Inside in 3D”), where you can take products apart layer by layer to see their internal components
Quick View, the device comparison matrix, the shopping bag and a full checkout flow (shipping details, payment, order review and confirmation)
Customer sign-in and an admin dashboard for managing the store
Website features
Interactive 3D exploded views of products, with labelled internal parts and an explode slider
A mega-menu navigation and fast category browsing
Product configuration (storage and colour variants) with live pricing
Wishlist, compare and shopping bag functionality
Device comparison matrix
A simulated checkout with order confirmation
Customer accounts (sign-in)
An admin dashboard with store stats and inventory and price management
A newsletter signup section
A toggle to turn the 3D experience on or off
A responsive, dark and light themed premium UI
Note: I made this video with the help of AI, and it is just a demo to show my skills. To see my work properly, I recommend visiting live website.
4
848
SaaS| Browser Extension Developer| Save Time with automation
SaaS| Browser Extension Developer| Save Time with automation
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
PromptVault AI is a Chrome extension I built that helps users
generate, save, organize, and reuse high-quality AI prompts in
seconds. The extension uses a guided question workflow where users
answer a few simple questions and the AI crafts perfect prompts
tailored to their specific needs.
Key features I developed:
AI-powered prompt generation for content creation, code generation, data analysis, and problem solving
Guided multi-step question workflow to capture user intent
Prompt Library & Storage to save and organize prompts
One-click copy to use prompts anywhere instantly
Keyboard shortcut support (Ctrl/Cmd) for power users
Clean sidebar UI that works on any webpage
Secure, private, and fast — no data leaves the browser
Tech stack: React, JavaScript, Chrome Extension APIs, AI API
integration, HTML/CSS
1
69
PageMind AI is a Chrome extension I built from scratch that brings
AI-powered browsing capabilities directly into the browser. The
extension allows users to interact with web page content using AI,
summarize pages, ask questions, and get instant explanations without
leaving the tab.
Key features I developed:
AI chat integration that understands and responds to page content
Clean, responsive extension UI built with React and JavaScript
Session tracking with counters for messages and interactions
Sidebar panel that opens within any webpage seamlessly
Secure and optimized for fast, lightweight performance
Tech stack: React, JavaScript, Chrome Extension APIs, AI API
integration, HTML/CSS
1
68
Frontend Developer | Clean & Responsive Web Experiences
New to Contra
Frontend Developer | Clean & Responsive Web Experiences
Zahnmedizin Lichtenstein — Premium Dental Practice Website
A dark-luxury themed website concept designed for a private dental practice in Berlin-Charlottenburg, built to showcase what a modern, high-end dental clinic website can look like.
Key Features:
• Dark Luxury design — deep anthracite tones with elegant blue & warm gold accents
• Full bilingual support (German/English) with instant language switching, no page reload
• Custom interactive appointment booking calendar with smart date validation
• Complete legal pages (Impressum, Datenschutz, AGB) — fully GDPR compliant
• Fully responsive design with smooth animations across all devices
Tech Stack: HTML, CSS, JavaScript
Workflow: Built using a modern AI-assisted development process, combining hands-on frontend expertise with AI tools for faster, high-quality delivery.
Live demo: https://musical-douhua-abefcf.netlify.app
0
86
GreenHarvest — Organic Grocery Store Website
A responsive multi-page e-commerce website designed for organic grocery stores, fresh produce brands, supermarkets, and food businesses.
GreenHarvest features a clean shopping experience with modern UI, responsive layouts, interactive product sections, and smooth frontend interactions.
Built With
HTML5 · CSS3 · Vanilla JavaScript · Tailwind CSS · Font Awesome
Features
13+ responsive pages
Product filtering and sorting
Product detail pages
Shopping cart and checkout flow
Wishlist
Order tracking interface
Blog and blog detail pages
FAQ, About, and Contact pages
Light/Dark mode
Mobile, tablet, and desktop responsive design
Smooth animations and interactive UI
Link:
https://8422416231673.gumroad.com/l/GreenHarvest
0
174
Meridian Electric Co. — Website Design & Development
A full marketing website built with plain HTML, CSS, and vanilla JavaScript — no frameworks, no libraries.
What's in the build:
7 pages via a custom hash-based client-side router: Home, About, Services, Projects, Service Area, Contact, and a multi-step Quote form
Dark navy/amber visual design with a custom typography-led layout
Vanilla JS (ES6+) features: scroll-reveal animations, animated number counters, a step-by-step process timeline, image carousel, accordion, before/after image slider, lightbox gallery, magnetic button effects, custom cursor, mobile menu, contact form handling, and quote wizard
Live demo: https://meridian-electric-co-nine.vercel.app/
0
292
PixelPulse is a fully interactive front-end e-commerce experience built with HTML, CSS (Tailwind), and vanilla JavaScript — designed to feel like a modern, production-grade shopping platform.
Key Features:
Dynamic Storefront — Hero banners adapt based on time of day (e.g. "Fresh Morning Deals" vs "Midnight Madness Offers"), giving the store a living, context-aware feel.
Live Category Filtering — Instant product filtering across Tech, Fashion, Accessories, and Sports & Gym without page reloads.
Dark / Light Mode — Seamless theme toggle that persists across the entire shopping journey.
Real-Time Cart Management — Add-to-cart updates the cart counter instantly, with quantity controls on the cart page.
Smart Checkout Flow — Payment method selection dynamically reveals the relevant fields (e.g. card details only appear when "Credit Card" is selected).
Fully Responsive UI — Clean grid layouts, product cards with ratings/discounts, and a polished multi-page navigation (Home, Shop, Categories, Deals, Cart, Checkout, Contact).
This project showcases front-end architecture for state-driven UI (cart state, theme state, filter state) entirely on the client side, with attention to micro-interactions and real-world e-commerce UX patterns.
Tech Stack: HTML5, Tailwind CSS, JavaScript (Vanilla)
https://8422416231673.gumroad.com/l/PixelPulseStore
0
315
Shopify & Webflow Developer for Conversion-Ready Stores
- 32
- Followers
Shopify & Webflow Developer for Conversion-Ready Stores
Case Study: From "Coding Hell" to a Premium Custom Shopify Store ✨
🚨 The Problem: A handmade furniture business owner tried using AI to generate code for their Shopify store. The result? A broken layout and a frustrated founder with zero coding experience who couldn't update their own site.
💡 The Solution: I stepped in to clean up the backend and rebuild the frontend architecture so it looked fully custom but was incredibly easy to manage.
Key Deliverables:
✔️ Erased the broken code and rebuilt the homepage using native Shopify sections.
✔️ Established a premium, rustic visual identity with custom typography.
✔️ Built a dynamic quote header and a conversion-focused footer email capture.
✔️ The Best Part: I mapped every single custom feature into the Shopify Theme Editor. The client now has complete freedom to manage text, fonts, and images entirely code-free.
Beautiful UI meets perfect usability. Drop a 🪵 in the comments if you love a rustic aesthetic, or send me a DM if your Shopify store needs a cleanup!
#ShopifyExpert #ShopifyDesign #FrontendDevelopment #EcommerceWebsite #FurnitureBrand
Option 3: Short & Punchy (Best for X / Twitter or a quick update)
AI generated code broke this handmade furniture brand’s Shopify layout, leaving the non-technical founder stuck in "coding hell." 🛑💻
I stepped in to clean up the mess. I rebuilt the homepage using native sections, added custom typography, a dynamic quote header, and a sleek email capture.
The biggest win? Moving the entire architecture into the Shopify Theme Editor so the client can manage their premium, rustic storefront 100% code-free. No more touching Liquid files! 🛠✨
#Shopify #UIUX #WebDev #Ecommerce
1
1
142
🛍️ Custom Shopify Bundle Builder UI | High-Converting Frontend Architecture
🪝 The Hook:
Standard Shopify themes only take you so far. When a client needed a dynamic, step-by-step bundle selection flow that felt both intuitive and premium, we moved beyond off-the-shelf solutions to build a custom frontend layout from the ground up. 🚀
🎯 The Project Vision:
The goal was to design a modern, visually striking bundle builder inspired by a high-performing reference site—but with a completely unique UX/UI tailored to the client’s specific brand identity. I architected a clean, conversion-optimized frontend layout that allows customers to visually build their bundles step-by-step with zero friction. ✨
⚙️ The Challenge & The Execution:
The main challenge was capturing the seamless behavioral flow of the reference site without creating an exact clone. I solved this by designing a custom UI structure with modern spacing, intuitive interactive states, and a crystal-clear navigation flow. The result is a Shopify-ready frontend layout perfectly prepped for backend functionality integration. 🛠️
📦 Key Frontend Deliverables:
🪜 Step-by-Step Visual Flow: Intuitive navigation that guides the user through the bundle process effortlessly.
💳 Dynamic Product Cards: Clean, engaging layouts with clear "selected" and "unselected" visual states.
📌 Sticky Pricing & Summary Area: Ensuring users always know their bundle status and total cost to reduce cart abandonment.
📱 Fully Responsive Architecture: A flawless experience across desktop, tablet, and mobile breakpoints.
💬 Looking for a custom UI/UX solution for your Shopify store? Let’s chat about how we can elevate your customer journey and boost your Average Order Value (AOV). 📈
0
75
🚀 Stop Losing Sales at Checkout: How I Fixed Fatal Shipping Errors for an Established E-commerce Brand
Did you know that a "Shipping not available" error at checkout is the fastest way to lose a customer forever? 💸
An established e-commerce client came to me with a massive conversion roadblock. They wanted to offer a seamless "Free Standard Shipping over $50" alongside live-calculated "UPS 2-Day Express" rates. The problem? Overlapping Shopify shipping zones were triggering fatal checkout errors, and strict API verifications were blocking them from fixing their shipping profiles.
Here is how I turned their checkout from a bottleneck into a breeze:
🛠️ Full Backend Audit: I hunted down and resolved the overlapping zone conflicts that were breaking the checkout logic.
🔌 Seamless API Integration: I securely integrated and verified the official UPS application to successfully unlock real-time, automated rate calculations.
✨ UI/UX Cleanup: I streamlined the checkout interface. Customers now see a frictionless, crystal-clear choice between standard flat-rate shipping and live 2-day express.
The Result?
Zero checkout errors, a flawless customer experience, and an automated shipping logic that protects their profit margins while giving customers exactly what they want.
👉 Struggling with a clunky checkout or complex shipping rules on your store? Send me a message and let’s get your conversions back on track!
0
100
Custom Responsive Category Navigation UI for Shopify 🚀
Default Shopify themes don't always cut it. When a retail brand needed to upgrade their bulky homepage navigation to a sleek, visual grid, I built them a custom solution from the ground up.
The Build:
The Grid: Built a custom CSS Grid layout for a flawless 4-column (desktop) to 2-column (mobile) responsive shift.
The Feel: Integrated premium micro-interactions (soft hover lifts and color transitions) for a high-end, tactile user experience.
The Handoff: Engineered the section to be fully integrated with the Shopify Theme Editor, allowing the client to swap out categories and images without needing a developer on standby.
The result? A space-optimized, highly visual discovery tool that looks incredible on any device.
Option 3: Client-Centric & Benefit-Driven
Title: Giving Shopify Stores a High-End "SaaS" Feel 🎨
How do you make a growing catalog easy to navigate without cluttering the screen?
For my latest retail client, the answer was a custom, highly visual grid-based category navigation system. Their default theme was too bulky, so I coded a custom Shopify section designed specifically for elegant visual discovery.
What I Delivered:
Pixel-Perfect Scaling: A flawless 4-column to 2-column responsive shift powered by CSS Grid.
Elevated UX: Premium micro-interactions like soft hover lifts that make the e-commerce experience feel high-end and interactive.
Total Client Control: Built completely into the Shopify Theme Editor so the brand's team can update images and links on the fly.
Which style speaks to your portfolio the most—do you prefer focusing on the technical build, or the business value you brought to the client?
0
67
Name: Zain Ul Hassan
Agency: Pixitech Studio
![Cover image for [https://coffeechatboot.netlify.app/ demo link]
AI Coffee](https://media.contra.com/image/upload/q_auto:good,w_800/rdiqgvt3d5goq27qzt64.avif)
[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
0
15
![Cover image for [https://imc-realestate-demo.netlify.app/ demo link]
IMC Real](https://media.contra.com/image/upload/q_auto:good,w_800/zn2bsgzsn6wijyxevdw5.avif)
[https://imc-realestate-demo.netlify.app/ demo link]
IMC Real Estate — Luxury Property Management Website
Designed a premium real estate website for IMC Real Estate, focused on luxury property listings, professional property management, and real estate investment services.
The website features a sophisticated dark interface with elegant gold accents, premium property cards, advanced property search filters, service sections, company information, client testimonials, rental valuation calls to action, and a professional contact form.
Key Features
Luxury real estate website UI
Property listings with prices and property details
Search filters for location, property type, and budget
Featured residential properties grid
Property management and luxury sales services
Company expertise and trust-building sections
Client testimonials and reviews section
Rental valuation call-to-action section
Contact form and business information
Premium dark theme with gold accents
Project Type: Real Estate Website Design & Development
Tools & Technologies: HTML, CSS, JavaScript, Responsive Web Design
0
18
![Cover image for [ https://aurliaecomrce.netlify.app/ demo link ]
AURELIA](https://media.contra.com/image/upload/q_auto:good,w_800/xaa8eabjvy5thstdslhz.avif)
[ https://aurliaecomrce.netlify.app/ demo link ]
AURELIA — Modern Fashion & E-Commerce Website
Designed a premium fashion e-commerce website for AURELIA, featuring an elegant and modern interface with a sophisticated black, white, and gold color palette.
The website showcases a complete online shopping experience, including a promotional hero banner, product categories, featured product listings, shopping deals, brand information, customer testimonials, newsletter subscription, and a contact section.
Key Features
Modern and responsive e-commerce UI design
Fashion, accessories, and electronics product categories
Featured products with pricing and ratings
Promotional banners and seasonal sales sections
Brand story and customer testimonials
Newsletter subscription and contact form
Elegant typography and premium visual styling
Tools & Technologies: HTML, CSS, JavaScript, Responsive Web Design
Project Type: Fashion E-Commerce Website Design
0
23
[ https://aurilarealstate.netlify.app/ demo link ]
Designed a premium luxury real estate website featuring an elegant hero section, property search filters, featured residence listings, and sophisticated typography. The design focuses on a refined user experience with a clean layout, modern architecture imagery, and a black, cream, and gold-inspired visual identity.
Key Features
Luxury real estate website design
Property search and filtering interface
Featured property listing cards
Elegant typography and premium visual styling
Modern, user-friendly layout
0
22
Web & AI Development | E-commerce Account Management
