Maaz M.'s Work | ContraWork by Maaz M.
Maaz M.

Maaz M.

Product Design, Growth and Developer | E-Books and Software

    5.00
    Rating
    11
    Followers
Followed by Osama A, Rahman R, and Ibe U

Karachi, Pakistan

WorkPostsReviewsServicesAbout

Karachi, Pakistan

I designed this concept website for a custom home builder. The idea was to let people design their house themselves and see a real price before they ever speak to a salesperson. The challenge was to make something as complex as building a home feel simple, visual and even fun. Hero. The headline makes the promise in bold, tightly set type: "Design your new home in 3D. See what it costs in minutes.", with a hand-drawn rust underline beneath "in minutes." On the right, a model farmhouse sits inside an architect's frame with dimension lines (65′ 10″ × 32′ 6″) and a north arrow. Under it, a project card shows the design name, living area and ballpark price, with a dark "Customise this plan" bar. Three small checkmarks, "No sign-up," "Takes about 3 minutes" and "Free consultation," remove hesitation before the visitor starts. Visual language. I built the whole site around an architectural drawing set: Numbering: every section is labelled like a blueprint sheet (A-102, A-201, A-301), and monospace labels read like annotations on a plan. Grid: a faint drafting grid runs behind the page. Palette: warm paper cream, charcoal ink and one rust-orange accent for buttons and key prices. The navigation is numbered too (01 Design yours, 02 How it works, 03 Our homes, 04 FAQ), with a US/UK currency switch and a click-to-call phone number. The 3D designer. This is the heart of the site. On the left, a live 3D model of the house; on the right, a step-by-step panel: Start: choose from four starting designs (Contemporary, Modern Farmhouse, Traditional, Single-Storey) or start from scratch. Size: storeys, a living-area slider, a rectangle or L-shaped footprint, ceiling height and basement. Rooms: steppers for bedrooms and bathrooms, plus chips for a home office, laundry, pantry or media room. Roof: shape, pitch, material and colour swatches. Exterior: cladding type, colour and accent options like a stone base. Windows: window count, window style, rear doors and balconies. Outdoor: garage size, porch and patio, plus a roof terrace or fireplace. Finish: Essential, Premium or Luxury, ending on a summary. Every choice rebuilds the 3D house instantly, and a live estimate at the bottom of the panel updates with each decision. The viewer has its own controls: front, back, side and aerial cameras; a night mode with glowing windows; an inside cutaway of the floor plan; dimension overlays; and zoom. Supporting the decision. The rest of the page answers what a buyer asks next: "Three steps from first sketch to front door" uses large outlined numbers and simple line icons. "One team. One price. No surprises." lists the builder's guarantees. "Start from a favourite" shows four home designs as plan cards with specs and prices, each loading straight into the designer. The build schedule is a Gantt-style timeline across 11 months, from consultation to handover, separating "with you" steps from "we handle it." Client notes and FAQ: client notes pull out one large quote, and the FAQ gives five straight answers. The page closes on a dark section, "Your home, designed in minutes.", with a line drawing of a house and two clear actions: design your home or talk to the team.
0
19
I designed this website for Kodsinc, a digital product and AI studio. The goal was to feel cinematic and ambitious from the first second, while explaining clearly what the studio builds and how it works with clients. The hero opens on a full-screen video of a glowing wireframe city with the Kodsinc wordmark at its centre. Beneath it, a tilted band scrolls through the studio's capabilities: AI voice agents, chat bots, automation, data and analytics, SaaS platforms and custom CRMs. As visitors scroll, the header condenses into a compact "Start a project" pill that expands into a numbered navigation menu. An AI assistant called Aria greets visitors, asks their name and offers suggested questions, so the site demonstrates the studio's own product from the start. For services, I designed a 3D card carousel. Seven vertical cards fan out side by side, and the selected one expands to reveal an illustration and the tools behind that service. The work section, "Work built to move," presents five products (Northstar, Flow CRM, AriaFin, WhatsApp SDR and Aria Assistant) as large stacked cards with device mockups. The page then builds trust. An interactive world map shows offices across five countries, and "Remote by location. Onsite in how we deliver" explains how the team stays close to clients. Security and compliance badges appear before the FAQ. The contact form sits beside the FAQ as a fill-in-the-blank sentence with a dropdown for the type of help needed. The page closes with the line "From Code to Intelligence," which sums up the studio in four words.
1
170
1 Collaborator
I designed this website for an AI studio that builds voice agents, chat agents and automation for businesses. The challenge was to make AI feel friendly and tangible to owners who have never heard an AI agent handle a phone call. The hero headline, "Your front office, answered by…", completes itself with rotating phrases in cobalt blue. The layout is clean and airy, with a soft periwinkle glow, a bold geometric typeface and a floating pill-shaped navigation bar. The centrepiece is the "Meet the Agents" showcase. I gave each AI agent a character and personality: Tom for real estate, Aria for marketing and Anna for private clinics. Each has a 3D illustrated figure, its own colour scheme and a giant typographic backdrop naming its industry. Visitors can switch between agents or start a live voice conversation in the browser, with microphone and speaker controls. Services are laid out as a bento grid of six tiles. Each opens a "see it work" window that explains how the service works, what's included and how to get started, so the details are there without crowding the main page. Past projects appear as stacked case study cards that layer on top of each other as you scroll, each showing a real dashboard preview. A bold cobalt band makes the business case, "Every missed call is a competitor's booked job," and it's followed by results, a dark process section titled "Live in weeks, not quarters," and a focused FAQ.
1
0
142
I designed and built this website for an award-winning aesthetic clinic in Fitzrovia, London. The goal was to feel like stepping into the clinic itself: calm, premium and personal, while guiding visitors towards the right treatment. The hero is a cinematic video of the clinic interior that moves forward as you scroll, while the headline "Advanced Aesthetics. Personalised Around You." gently fades away. It creates the feeling of walking through the door. I paired an elegant serif with gold italic accents, against a palette of warm cream, champagne gold and deep espresso. Navigation is built around the patient rather than the service menu. The "Start With What Matters to You" section offers two paths: browse by concern, such as ageing skin, redness or stubborn fat, or by treatment, for patients who already know what they want. Both paths use swipeable cards with real portrait photography. Trust runs through every section. The founder is introduced in a magazine-style feature, qualifications appear as clear credentials, and awards sit alongside "As Featured In" logos from national press. A results gallery can be filtered by skin, tightening, body and contouring. The full-screen menu brings every treatment, the clinic photo, the address, opening hours and a booking button into one elegant overlay. The page closes with a "Not Sure Which Treatment Is Right for You?" call to action, so undecided visitors always have a next step.
0
135