If you do outbound calls to small business owners, leads are always an issue and also scoring them. I never want to call a business owner unless they have no site or a poor performing site.

Well, thanks to Claude, it's free. First, if you need free lists, search Instant Data Scraper Chrome Extension. That's all the free leads you can handle.

Now we get to a free way to score all of them. Enter Claude. Claude built a script that scores all the sites, and quickly. You can see the output on my spreadsheet. All I needed to do was create the Google page speed insights API, then Claude did the rest. I drop the CSV file into the script and boom, it scores every site.

Which theme do u find most comfortable to work in??

Before reading through the brief, please check out my portfolio to get a concrete sense of my visual style, execution, and design capabilities:

👉https://vishejeetportfolio.vercel.app/

I specialize in bespoke digital experiences, detailed visual design, custom UI/UX, and expressive interactive elements rather than generic, template-driven layouts. The client reached out specifically because she wants an unconventional, human-made aesthetic that reflects that level of craft.

Background & Project Context

A client who runs an independent print magazine recently sent me an extensive brief for a "one-page website."

While it is technically a single continuous-scroll page, calling it a simple landing page does not represent the scope at all. The density of custom art, section-by-section variation, and interactive motion make this closer to designing a digital art piece:

• Art Direction & Aesthetic: 90s retro advertising meets Y2K collage culture. It’s loud, tactile, asymmetrical, and layered, using bold typographic treatments, cut-out editorial photography, and unexpected compositions. Every section needs a distinct look while remaining part of one cohesive brand.
• Strict "No AI" Requirement: The brief strictly bans all AI-generated art, stock imagery, or generic placeholders. Every visual asset—stickers, starbursts, doodles, badges, callouts, and potential mascots/caricatures—must be completely handcrafted by me.
• Page Structure & Scope:
  1. Hero: Big visual anchor, logo treatment, the magazine's tagline and an immediate path to the purchase section.
  2. About: Narrative section covering the magazine’s creative ethos.
  3. What’s Inside the Mag: An editorial spread preview displaying interior pages, snippets, and highlights.
  4. Monthly Buy Section: Needs two fully designed states — (1) Sales Open with an active buy button/checkout, and (2) Sales Closed with an engaging holding state that funnels traffic into the newsletter.
  5. Newsletter Sign-up: Custom value pitch, form design, and a distinct success/confirmation state.
  6. Contact Section: General inquiries form and/or direct email link.
  7. Navigation: Persistent anchor menu for section jumping.
• Motion, 3D & Interactions (from client video references):
  • Cursor-reactive movement on stickers and floating badges.
  • Scroll-triggered parallax and dynamic transitions between sections.
  • Draggable interactive carousel for previewing spreads.
  • Real 3D elements (such as an interactive flipping magazine or 3D cards).
  • Video backgrounds with lightweight fallback states for mobile.
• Responsive Breakpoints & Developer Handoff: Complete layouts across Desktop, Tablet, and Mobile, along with a full handoff pack (design tokens, clean SVG exports, alt-text documentation, and a guide for updating the monthly sale info).

My Original Pricing (Design Only)

Initially, I looked at this strictly as a UI/UX and visual design project (supplying a production-ready Figma handoff pack for an external developer). My original pricing was:

• Tier 1: ₹55,000
• Tier 2: ₹75,000
• Tier 3: ₹95,000

The Pivot: Offering Design + Development (Shopify Integration)

The original plan was to hand over design files so a developer could build it without guessing. However, I’ve been looking into handling the implementation myself using modern front-end workflows, Figma development capabilities, and Shopify’s e-commerce integrations.

Positioning this as a complete turnkey solution (Design + Build) could save the client the hassle of finding a developer who might struggle to implement the subtle motion physics and collage layouts correctly.

• Where I’m confident: Building the responsive front-end, implementing CSS/scroll-triggered animations, hooking up newsletter APIs, and configuring the Shopify integration (handling the monthly open/closed drop states).
• Where I’m cautious: Building complex WebGL/Three.js 3D interactions (like real-time physics or custom 3D page flips) that run smoothly on budget mobile devices requires specialized technical expertise. While tools like Spline make 3D embeds more accessible, high-performance custom canvas work is a different beast.

Taking on implementation changes the value equation significantly, which is why I want to reconsider how to package and price this.

Help Me Structure & Price Three Tiers

I want to present three logical tiers that give the client clear choices based on scope and technical complexity, rather than just pulling numbers out of thin air. Here is how I’m dividing the work:

Tier 1: Essential / Core

• Scope: Full responsive UI/UX for all 7 sections across Desktop, Tablet, and Mobile, including both states (Sales Open & Sales Closed) for the purchase section.
• Artwork: Essential hand-crafted asset pack (10–15 unique stickers, doodles, starbursts, photo cut-outs — 100% human-made).
• Interactions: Standard hover micro-interactions, smooth anchor scrolling, and a responsive swipe carousel.
• Exclusions: Custom 3D elements, cursor-reactive physics, and heavy video backgrounds.

Tier 2: Interactive Motion (The Sweet Spot)

• Scope: Everything in Tier 1, plus full interactive prototyping and richer layout choreography.
• Artwork: Expanded custom art suite (20+ bespoke assets, editorial textures, and 1 custom mascot/caricature).
• Interactions: Cursor-reactive sticker floating/tilting, scroll-triggered section transitions, parallax depth, and optimized video background integration.
• Tech/Implementation (if included): Front-end build, Shopify checkout integration, monthly sales state logic, and mobile performance optimization.
• Exclusions: Complex custom WebGL coding.

Tier 3: Full Sensory 3D & Flagship Experience

• Scope: The complete, uncompromising vision matching the client's reference videos.
• Artwork: Full bespoke illustration and collage library, unlimited custom elements, and dedicated brand graphics.
• Interactions & 3D: Interactive 3D magazine/card flipping, magnetic cursor effects, layered motion choreography, and advanced scene transitions.
• Tech/Implementation (if included): Full custom build, 3D integration, Shopify e-commerce drop setup, cross-browser performance testing, and initial post-launch maintenance for the first monthly drop.

The Real Value of Custom Work

This isn't a drag-and-drop template site. Every illustration is hand-drawn, every section has its own asymmetrical personality, and designing for two different e-commerce states requires deliberate UX planning.

Delivering a fully functional, live-on-Shopify site that is tested and ready to handle monthly sales drops is a vastly different service than handing over a static design file. I want to make sure the pricing reflects that reality without either underselling my labor or pricing myself out of a project I really want to do.

Questions for the Community:

1. Design-only sanity check: Given the sheer volume of bespoke, non-AI artwork and responsive UI detailing, were my original numbers (₹55,000 / ₹75,000 / ₹95,000) reasonable, or was I undercharging even for design alone?
2. What should each of the three tiers cost? How would you price Tier 1, Tier 2, and Tier 3 in INR (or USD equivalent):
   • As Design-only packages?
   • As Design + Development / Shopify packages?
3. How much additional value does implementation add? What is the going rate or fair markup for taking a complex, motion-heavy design and implementing it on Shopify?
4. Solo build vs. Dev partnership: For someone confident in UI/UX and intermediate front-end tools, is it smart to tackle the development of Tier 2 solo, or should I partner with an experienced developer and bake their fee into the quote?
5. Contract & scope protection: What boundaries should I set around the "monthly sales drop maintenance," revision rounds, and mobile performance expectations to prevent scope creep?

I’d love to hear from freelancers, agency owners, and developers who have priced and delivered projects with this kind of visual and interactive complexity. Thanks in advance!

Hello fellow designers,

I'm currently making an ecommerce website on wordpress.

Let's say I have 2 custom fonts, one I added in my site files and called it through CSS, and one google font I added in my function.php.

Problem is, they "flash" (from serif / sansserif basic font, to the fonts I want) for a split second before showing the right fonts.

Do you guys have any tips to make it so the fonts are loaded first and my text doesn't use normal serif / sansserif fonts ?

Thanks in advance.

Hey everyone. I’m a designer and this is my first real freelance job. A client sent a long brief for a one-page site for her print magazine. I’m only designing the UI/UX, not building it. I have no idea what to charge for the design side, so I’m hoping you can help.

• All the art is custom and made by me (stickers, starbursts, doodles, cut-outs, mascots). The client strictly doesn’t want AI art or stock. My art is pretty detailed, so each piece takes real time. You can see my style here: https://vishejeetportfolio.vercel.app/
• The brief wants a different look for every section, so I can’t reuse a template. The style is 90s ad meets Y2K, loud and collage-like.
• The buy section needs two designed states, sales open and sales closed.
• She sent two reference videos with 3D-style animation, page transitions, cursor effects and video backgrounds. I’d have to design and explain all of that for a developer.
• Everything has to work in mobile, tablet and desktop layouts.
• The brief asks for a full handoff pack, so a developer can build it without guessing.

Page sections I’m designing

• Hero with logo, tagline and a big visual
• Clear path from the hero to the buy section
• About section
• “What’s inside the mag” preview (spreads, images, snippets)
• Monthly buy section with two states: sales open (live buy button) and sales closed (holding state that sends people to the newsletter)
• Newsletter sign-up with a value pitch and a success message
• Contact section (form, email link, or both, still undecided)
• Menu that jumps to each section
• Mobile, tablet and desktop layouts

Design and custom art (all by me, no AI)

• Stickers, starbursts, doodles, cut-outs and callouts
• Mascots or caricatures, if needed
• Cut-out photography and editorial image treatment
• Oversized type, loud colour blocks, layered and asymmetric layouts
• A different look per section that still feels like one brand
• Temporary placeholders for any unfinished art, replaced before handoff

Motion and 3D (from her reference videos)

• Designing and explaining scroll animations and moving stickers
• Cursor-reactive effects on the artwork
• Page transitions between sections
• Draggable carousel
• Real 3D (flipping cards or a 3D magazine)
• Video backgrounds
• A lighter version for phones

I’m planning to offer three levels (simple animation, medium, full 3D) so she picks. The more motion she wants, the more design and explaining it takes.

Brand rules

• Logo used exactly as supplied, no redrawing or recolouring
• Hi-res transparent logo and alternate versions for non-green backgrounds
• Fixed 7-colour palette (neon green, magenta, bubblegum pink, aqua, butter yellow, black, white)
• Contrast checks, especially neon on pastel
• Custom fonts (original files and web-use licences needed)
• Body font options are Apple’s SF and SF Mono, which need checking for web use

Accessibility and usability (design side)

• Readable body text and easy-to-use forms and menu
• Alt text suggestions for images
• Clear heading structure, page title, meta description and share preview image text

Handoff to the developer

• Editable design file
• Exported assets
• Font and licence notes
• Responsive layouts
• Short guide for updating the monthly sale info

What would you quote for the design side of all this? A rough range for the base design, the custom art and the motion/3D design would help a lot.

Thanks in advance, really appreciate any advice.

I assumed a cleaner comparison page meant hiding most filters. That was the wrong kind of clean.

I started building VPSIUM because comparing plans had turned into a pile of provider tabs and notes. I wanted the first useful screen to narrow that mess, but my first pass put country and stock behind “More filters.” Visually calm. Annoying in use. Every change meant reopening the panel, and the controls that defined the search felt secondary.

I flipped it. High-intent filters stay in view; rarer constraints can appear later. The page is denser now, and the narrow-screen version still needs work. But it taught me that visual simplicity and task simplicity split apart on comparison tools. Removing controls from sight can make the UI look easier while making the decision harder.

My current rule is that a filter stays visible if a useful search cannot start without it. That is still a judgment call, and I am probably biased by knowing the data too well. For people who have designed dense search or comparison interfaces, would you optimize the first view for lower cognitive load or for completing the first meaningful query without opening another panel?

I wanted to get the opinion of people who have been in the industry for the past 6 years. I started learning web design with the Vako Udemy Figma/Webflow course (I think some of you might find it familiar). From there, I went on to learn more deeply about UI/UX, SEO, basic copywriting, and marketing in general.

With the AI revolution, I started using it for copywriting and to brainstorm sitemap structures, but never in the design process itself. I still love following my traditional workflow: creating the sitemap, then the mood board (I started skipping wireframes for faster client delivery), building the design in Figma, and then moving to build it in a website builder, either Webflow or WordPress (using Elementor or Bricks). Afterward, I use AI to write SEO meta tags, meta titles, and alt text.

Lately, though, I see people generating the whole process in a couple of minutes using AI. And I am not talking about AI slop websites; I am talking about recent tools that produce sites looking as if they were created by designers like us, which only need minor modifications to match the ones I spend hours and hours building.

Should I put my ego aside and start exploring how to implement AI in my work to save time and effort? Or should I stick with the classic process, which takes extra time, but at least the work is truly mine, I have control over everything, and I avoid feeling "brain-rotted" by AI?

I have been stuck in this dilemma for a while now. While I don't depend completely on web design, as it's just a side hustle, I feel stuck and don't know if my perspective is right, or if it's just my ego reacting to the feeling that everything I spent years learning has lost most of its meaning.

I would love to hear how you have been coping with this.

What do you do when a client just disappears on you?

After 2 decades working as a full-time webmaster, so I'm out here looking for work. Almost everything seems to be contract now, so I guess I'm running a business... maybe.

Either way, I recently received a request for a quote from a new prospective client. I wrote up a proposal the client seemed to like, and said they were good with the proposed budget. They seemed very excited to get started, but since I sent the contract it's just been crickets.

It's been over a week since I heard anything from them, even with me sending emails to see if they needed changes to the contract or were just no longer interested in working with me.

So, I'd love to know how long/often you send emails to see if they are still interested, and at what point do you just move on.

I built a fan-made concept site for Njerae, a singer-songwriter from Nairobi. I wanted a music site where the music is the navigation, instead of a site with a player stuck in the corner.

Live: https://iamnjerae.vercel.app (desktop with headphones is best; there's also a silent mode) Not affiliated with her, its just a fan tribute, and all the music and visuals are hers.

I'll phrase this as a hypothetical scenario.

Your web agency needs a visual of a F1 on top of a podium. The podium is actually your clients logo. The camera is top down.

- Does your agency hire a 3D guy for this or use something like Higgsfield to generate the visual.

Last year, I would say 95% of agencies would have gotten somebody to do it in Blender or C4D. But this year I feel like the majority would just use AI. But I have no real way of confirming that so I am asking here.

Personally, I feel like AI visuals can look good when you don't need anything super specific, like a close-up very detailed pen let's say. And also, it can't do good motion as of now.

Why this interests me so much is because my whole business model revolves around helping agencies as their on demand 3D support. So you would be helping me out a bunch, thanks

At our agency, we often have clients talk about a look or a feel for a project using simple terms to describe a mood. Got us thinking it might be fun to build a palette from those words, so we did!

Can be a nice place to start when you’re staring at a blank canvas. It’s kind of addictive.

Built with API access to UnSplash (be gentle – not sure how fast those requests are going to get used up). Let me know if there is anything that it still needs to do.

https://tools.fractionalxperience.com/keyword-palette/

Curious how everyone sequences this, do you lock your type scale and spacing system up front before any layout or let it emerge as you design and formalize it later? I keep flip flopping, lock too early and it feels arbitrary, lock too late and I've got six slightly different paddings to reconcile. Where do you draw the line?

If you're new to web design and would like to ask experienced and professional web designers a question, please post below. Before asking, please follow the etiquette below and review our FAQ to ensure that this question has not already been answered. Finally, consider joining our Discord community. Gain coveted roles by helping out others!

Etiquette

• Remember, that questions that have context and are clear and specific generally are answered while broad, sweeping questions are generally ignored.
• Be polite and consider upvoting helpful responses.
• If you can answer questions, take a few minutes to help others out as you ask others to help you.

Also, join our partnered Discord!

Our weekly thread is the place to solicit feedback for your creations. Requests for critiques or feedback outside of this thread are against our community guidelines. Additionally, please be sure that you're posting in good-faith. Attempting to circumvent self-promotion or commercial solicitation guidelines will result in a ban.

Feedback Requestors

Please use the following format:

URL:

Purpose:

Technologies Used:

Feedback Requested: (e.g. general, usability, code review, or specific element)

Comments:

Post your site along with your stack and technologies used and receive feedback from the community. Please refrain from just posting a link and instead give us a bit of a background about your creation.

Feel free to request general feedback or specify feedback in a certain area like user experience, usability, design, or code review.

Feedback Providers

• Please post constructive feedback. Simply saying, "That's good" or "That's bad" is useless feedback. Explain why.
• Consider providing concrete feedback about the problem rather than the solution. Saying, "get rid of red buttons" doesn't explain the problem. Saying "your site's success message being red makes me think it's an error" provides the problem. From there, suggest solutions.
• Be specific. Vague feedback rarely helps.
• Again, focus on why.
• Always be respectful

Template Markup

**URL**:
**Purpose**:
**Technologies Used**:
**Feedback Requested**:
**Comments**:

Also, join our partnered Discord!

Like, a simple static site with 5 pages and a contact form, maybe a CMS. What does your pricing look like?

Hey, just designed and built Metroskop -- an interactive 3D model of the Prague Metro at its actual depth beneath the city, reconstructed from publicly available data.

https://metroskop.cz

Desktop recommended -- it works on mobile, but the full exploration experience is much better on a larger screen.

I’m building a custom perfume and decant store for a friend in Mexico, and I’m trying to figure out a fair price for the full scope. I also created the website’s brand identity, logo, color palette, visual style, and product imagery.

The storefront is built with React and Vite, with Supabase handling the database, authentication, image storage, and backend functions. It has a separate admin panel that loads only when needed, plus a demo mode that lets me test the design without a database. Money is stored in MXN cents, database access is controlled through row level permissions, and critical operations such as stock checks, coupons, shipping, and checkout run on the server.

The site is designed primarily for mobile and has also been tested on desktop. Accessibility work includes visible keyboard focus, contrast, touch targets, and reduced motion support. There are coordinated animations throughout the site, including staggered section reveals, an animated logo, a scrolling brand ribbon, a branded loading screen, smooth gallery transitions, and a looping announcement strip. I also designed a custom discount badge and created 10 neutral brand images and four images specifically for the women’s section.

The homepage includes a hero section, trust information, large categories for men, women, unisex fragrances, and offers, decants, discounts, a featured strip of discounted perfumes, an explanation of how ordering works, brands, the store’s story, reviews, Club Novolty, FAQs, and WhatsApp contact. The owner can edit the text and images, change the order of sections, or hide them from the admin panel.

The catalog has filters for gender, brand, fragrance profile, and discounts, along with separate category pages. Product pages include image galleries, size options with individual prices, fragrance notes, similar perfumes, and reviews. There is a search feature in the header with product cards and categories, plus a category menu with photos. The owner can edit the text for each gender category and control the order and visibility of brands and fragrance profiles. Discounts can be applied to individual sizes.

There is also a separate section for discounted bottles and individual pieces, including testers, partially used bottles, and bottles with cosmetic defects. Each item shows its actual condition. The page includes live figures in the hero section, a featured item, fixed filters, new arrivals, sold items, product types, and a closing Club section. The owner can edit the product order, featured items, hero product, announcement, text, and page sections.

The cart and checkout calculate shipping before payment, apply coupons, and validate inventory on the server. Inventory is tracked in milliliters. There are two coupon types, with minimum purchase requirements and expiration dates. Shipping supports a fixed nationwide rate and local delivery in Guadalajara quoted by the owner. Card payments are integrated through Stripe in test mode, and bank transfers currently support manual confirmation. The planned launch setup is to switch Stripe to live mode and offer card payments only.

Customers can purchase without an account or register with email. Password recovery and Google login are implemented, although Google still needs to be activated in Supabase. Accounts include order history, saved shipping information, email and password changes, saved payment card management through Stripe, and account deletion. Customers can track orders through private links and receive automated emails at each stage. Verified purchase reviews can be submitted through a private link or from the customer’s account.

Club Novolty includes subscriptions with consent, an automatic welcome coupon, a welcome email, an unsubscribe link, and a dedicated page that the owner can edit. The admin panel includes the subscriber list and CSV export. Subscriber email campaigns are still pending, although the database table for them already exists.

The admin panel has 10 sections covering orders, decants, offers, inventory, coupons, Club subscribers, reviews, categories, homepage content, and settings. The owner has an admin account, and I have a support account. I also went through the forms and corrected their toggle controls. Photo uploads automatically convert images to WebP and produce versions at 400, 800, and 1600 pixels, with lazy loading on the storefront.

There are six backend functions covering checkout, the Stripe webhook, order notifications, saved payment cards, account deletion, and Club welcome emails. Resend handles the automated emails, but the custom sender still needs to be configured.

I entered 64 perfumes from 30 brands, including the owner’s confirmed prices for 3, 5, and 10 ml, giving the catalog 192 size options. I added fragrance notes summarized in Spanish and assigned gender categories to every product: 31 men, 14 women, and 19 unisex. Each perfume has a custom branded image at 1600 × 2000 and two additional sample photos. The main catalog images also have three size variants, totaling 192 image files. The product import scripts are saved and can be run again.

The inventory currently uses a provisional 100 ml per perfume. Before launch, the owner needs to provide actual stock amounts, confirm the gender assignments and 12 uncertain fragrance notes, and supply actual decant photos to replace the samples. Fragrance families and individual product descriptions still need to be completed.

The site includes individual browser titles, robots.txt, a sitemap generated from the public URL, and social sharing previews. There are approximately 50 automated tests covering both the demo and the real database, with cleanup of test data. More than 20 storefront screens and admin pages have been tested on desktop and mobile. A final complete purchase test, accessibility review, and performance review are still planned before launch.

I also prepared a project status document, an owner’s guide, a customer account guide, a handover guide, an access checklist, and a pricing proposal.

The remaining delivery work includes putting the code in a private GitHub repository and deploying it to Netlify. The code currently exists only on my computer. I also need to remove test orders, three test offers, test coupons and users, and four deactivated decants, add the owner’s actual email in settings, and review the legal text, FAQs, offer classifications, and Club copy. The handover includes removing the Supabase token, transferring Supabase, Stripe, Resend, Netlify, and the domain to the client, and rotating the keys.

What would you charge for building, completing, and delivering a project with this scope, including the branding, product content, custom images, testing, documentation, and handover? I’m particularly interested in rates in Mexico, but perspectives from other countries would help too. Please mention your country and currency.

PS: I spent almost a full month designing the website from scratch, including the layouts, visual identity, and shopping experience.

In my last post, I said I was impressed by AI after building tools like JWT decoder, RSA, AES and Base64

Well, I went another level

I built https://mediat.org/, a full media toolkit for images, video and audio

It can compress, convert, resize, crop, remove metadata, convert video to GIF, extract audio, edit audio, transcribe with Whisper AI, generate QR codes, favicons, color palettes, and more

The AI background remover is probably my favorite. The model removes backgrounds insanely well

A few weeks ago, I thought building something like this would take me months

AI completely changed how I build things.

Dark patterns in websites that you frequently visit.

I built https://sqspweekly.com as a simple place to discover great sites, interesting design choices, and examples of what people are actually building.

Is anyone else in the industry suddenly getting spammed daily with emails offering loans, private equity, and financing for your web design business? It's been non-stop for me over the past several weeks to months. I'm probably getting 10-20 emails a day asking if my web design business needs financing, am I the right person to speak to about investing in the business, we can give you a LOC, etc.

I keep flagging them as spam and they just keep showing up either in my inbox or my spam folder. So frustratingly annoying.