<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: yudi wang</title>
    <description>The latest articles on DEV Community by yudi wang (@eudy).</description>
    <link>https://dev.to/eudy</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F4069858%2Fee528f32-8234-4fab-8283-5c0454245256.png</url>
      <title>DEV Community: yudi wang</title>
      <link>https://dev.to/eudy</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/eudy"/>
    <language>en</language>
    <item>
      <title>Building a look-first AI image generator instead of another blank prompt box</title>
      <dc:creator>yudi wang</dc:creator>
      <pubDate>Sun, 09 Aug 2026 16:22:44 +0000</pubDate>
      <link>https://dev.to/eudy/building-a-look-first-ai-image-generator-instead-of-another-blank-prompt-box-3deo</link>
      <guid>https://dev.to/eudy/building-a-look-first-ai-image-generator-instead-of-another-blank-prompt-box-3deo</guid>
      <description>&lt;p&gt;Most AI image tools still begin the same way:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Here is a blank prompt box. Now describe exactly what you want.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;That is powerful if you already know how to write prompts. But for many users, especially when the goal is visual style, the hardest part is not generation. It is deciding what to ask for.&lt;/p&gt;

&lt;p&gt;I have been building &lt;a href="https://blingblingup.app/" rel="noopener noreferrer"&gt;BlingBling Up&lt;/a&gt;, an AI image generator focused on a different workflow:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Browse a polished Look&lt;/li&gt;
&lt;li&gt;Add 1-3 photos&lt;/li&gt;
&lt;li&gt;Choose a quality level&lt;/li&gt;
&lt;li&gt;Generate from that visual direction&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Instead of starting from text, the product starts from taste.&lt;/p&gt;

&lt;h2&gt;
  
  
  Why a look-first workflow?
&lt;/h2&gt;

&lt;p&gt;Prompt-first tools are flexible, but they also create a lot of friction.&lt;/p&gt;

&lt;p&gt;If someone wants a glam, fashion, editorial, or soft-glam image, they may not know whether to write:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;studio portrait&lt;/li&gt;
&lt;li&gt;editorial beauty lighting&lt;/li&gt;
&lt;li&gt;polished glam look&lt;/li&gt;
&lt;li&gt;fashion campaign style&lt;/li&gt;
&lt;li&gt;soft natural makeup&lt;/li&gt;
&lt;li&gt;high-end lifestyle image&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Even when users know the rough direction, they often struggle to translate taste into prompt language.&lt;/p&gt;

&lt;p&gt;So I wanted to test the opposite flow:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Let users pick the direction visually, then let the system carry the prompt detail.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;The public gallery works like a collection of visual starting points. Each Look contains an image direction and prompt context. The user can choose one, add their own photos, and generate a result from there.&lt;/p&gt;

&lt;h2&gt;
  
  
  The first version
&lt;/h2&gt;

&lt;p&gt;The current version focuses on a few style pages:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Glamour&lt;/li&gt;
&lt;li&gt;Fashion&lt;/li&gt;
&lt;li&gt;Editorial&lt;/li&gt;
&lt;li&gt;Soft Glam&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;I intentionally kept the category set small. It is tempting to create dozens of SEO pages and style categories immediately, but that usually creates thin pages and a worse product experience.&lt;/p&gt;

&lt;p&gt;For now, I would rather have fewer pages that are easier to understand.&lt;/p&gt;

&lt;h2&gt;
  
  
  The product decisions I made
&lt;/h2&gt;

&lt;h3&gt;
  
  
  1. The homepage should show the product immediately
&lt;/h3&gt;

&lt;p&gt;The first screen is not a marketing landing page with abstract claims. It shows the actual workflow:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Pick a Look -&amp;gt; Add a photo -&amp;gt; Create
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;The gallery appears directly below the hero area, so users can start browsing immediately.&lt;/p&gt;

&lt;h3&gt;
  
  
  2. The gallery should not be overloaded with controls
&lt;/h3&gt;

&lt;p&gt;Early versions of AI products often expose too much:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;model names&lt;/li&gt;
&lt;li&gt;advanced parameters&lt;/li&gt;
&lt;li&gt;filters&lt;/li&gt;
&lt;li&gt;technical labels&lt;/li&gt;
&lt;li&gt;internal generation options&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;For this product, those details are secondary. The user is trying to find a look they like.&lt;/p&gt;

&lt;p&gt;So the discovery experience is intentionally simple:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;all images&lt;/li&gt;
&lt;li&gt;prompt keyword search&lt;/li&gt;
&lt;li&gt;visual cards&lt;/li&gt;
&lt;li&gt;theme pages&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  3. Creation should support both profiles and uploads
&lt;/h3&gt;

&lt;p&gt;The creation flow supports saved image profiles and one-time photo uploads.&lt;/p&gt;

&lt;p&gt;For uploads, the rule is simple:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;at least 1 photo&lt;/li&gt;
&lt;li&gt;up to 3 photos&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;That keeps the workflow lightweight while still giving the generation system enough visual reference.&lt;/p&gt;

&lt;h3&gt;
  
  
  4. Quality levels should be understandable
&lt;/h3&gt;

&lt;p&gt;Instead of exposing model names in the main product flow, the UI uses quality levels:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Fast&lt;/li&gt;
&lt;li&gt;Medium&lt;/li&gt;
&lt;li&gt;High&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;That is easier for users to reason about than provider-specific model language.&lt;/p&gt;

&lt;h2&gt;
  
  
  Technical shape
&lt;/h2&gt;

&lt;p&gt;The project is built as a web app with Next.js and deployed on Cloudflare.&lt;/p&gt;

&lt;p&gt;The app has a few moving parts:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;a public Look gallery&lt;/li&gt;
&lt;li&gt;detail pages for individual Looks&lt;/li&gt;
&lt;li&gt;a generation flow&lt;/li&gt;
&lt;li&gt;account and membership pages&lt;/li&gt;
&lt;li&gt;PayPal subscription payments&lt;/li&gt;
&lt;li&gt;structured SEO pages and sitemap support&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;One thing I had to be careful about was balancing SEO with performance.&lt;/p&gt;

&lt;p&gt;For example, a gallery full of large images is useful for discovery, but it can make the homepage slow. The better compromise is:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;use lightweight thumbnails in the main waterfall gallery&lt;/li&gt;
&lt;li&gt;keep detail pages for sharing and indexing&lt;/li&gt;
&lt;li&gt;include only quality candidates in the sitemap&lt;/li&gt;
&lt;li&gt;expand style pages slowly based on Search Console data&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;That way the product does not sacrifice user experience just to chase indexing.&lt;/p&gt;

&lt;h2&gt;
  
  
  What I am still figuring out
&lt;/h2&gt;

&lt;p&gt;Positioning is the hardest part.&lt;/p&gt;

&lt;p&gt;There are several possible ways to describe the product:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;AI image generator&lt;/li&gt;
&lt;li&gt;glam look generator&lt;/li&gt;
&lt;li&gt;AI fashion image tool&lt;/li&gt;
&lt;li&gt;look-first AI image creation&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;The broad keyword has more search demand, but the narrower positioning is more memorable.&lt;/p&gt;

&lt;p&gt;Right now I am trying to make the first screen communicate this:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Choose a polished Look, add your photo, and create a beautiful AI image without starting from a blank prompt.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;That is the core idea.&lt;/p&gt;

&lt;h2&gt;
  
  
  What I would love feedback on
&lt;/h2&gt;

&lt;p&gt;If you try it, I would love feedback on three things:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Is the look-first workflow understandable from the first screen?&lt;/li&gt;
&lt;li&gt;Does the product positioning feel clear?&lt;/li&gt;
&lt;li&gt;Which style categories would you expect next?&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;You can check it out here:&lt;/p&gt;

&lt;p&gt;&lt;a href="https://blingblingup.app/" rel="noopener noreferrer"&gt;https://blingblingup.app/&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;I am still early, but the main lesson so far is that AI product design is often less about adding more controls and more about choosing the right starting point.&lt;/p&gt;

&lt;p&gt;For this product, the starting point is not a prompt.&lt;/p&gt;

&lt;p&gt;It is a Look.&lt;/p&gt;

</description>
      <category>ai</category>
      <category>webdev</category>
      <category>sideprojects</category>
      <category>nextjs</category>
    </item>
  </channel>
</rss>
