# Indie hacker-marknadsföring: lanseringsgrafik utan designer [Canonical HTML page](https://gradiently.design/sv/guide/indie-hacker-launch-graphics) Du byggde produkten själv. Grafiken som säljer den är ett mycket mindre jobb än det ser ut: fem tillgångar, ett utseende och ord som säger vad den gör. ## The short version - Indie hacker-marknadsföring bygger på en liten uppsättning grafik: en Open Graph-bild, en X-header, inlägg för lanseringsdagen och en återanvändbar mall för build in public. - Open Graph-bilden är 1200×630 pixlar och visas på varje länk du delar, så gör den innan du berättar för någon om produkten. - En X-header är 1500×500 pixlar, och profilbilden täcker en del av det nedre vänstra hörnet, så håll orden borta från det området. - En lanseringsgrafik fungerar bäst med en rad som säger vad produkten gör för vem, på under åtta ord. - Samma bakgrund, typsnitt och layout på varje tillgång får en soloprodukt att se etablerad ut och hjälper följare att känna igen dina uppdateringar. Bra **indie hacker-marknadsföring** bygger på en handfull grafiker du gör en gång och använder i månader: en Open Graph-bild så att varje delad länk ser färdig ut, en X-header, ett lanseringsmeddelande och en mall för dina build in public-uppdateringar. Ingen av dem kräver en formgivare. De kräver rätt mått, ett enhetligt utseende och en rad som säger vad produkten gör på under åtta ord. Den här sidan går igenom alla tre och slutar med en checklista för lanseringsveckan som du kan jobba igenom redan ikväll. ## Lanseringsgrafiken en indie hacker faktiskt behöver Soloföretagare tenderar att antingen hoppa över grafik helt eller lägga en vecka på en illustration till landningssidan som ingen lägger märke till. Den användbara mitten är kort. Det här är tillgångarna folk faktiskt ser, i den ordning de ser dem. | Tillgång | Mått | Där folk ser den | Gör den | | --- | --- | --- | --- | | Open Graph-bild | 1200×630 | Varje länk du delar på X, LinkedIn, Slack, Discord och i meddelanden | Innan du berättar för någon | | X-header | 1500×500 | Din profil, som folk öppnar efter ett bra svar | Två veckor innan | | Inlägg på X eller Bluesky | 1600×900 | Lanseringsinlägget och milstolpsinläggen | Lanseringsveckan | | Stående LinkedIn-inlägg | 1080×1350 | Lanseringsinlägget för en professionell publik | Lanseringsveckan | | Build in public-kort | 1080×1350 | Veckouppdateringar på X, Threads och LinkedIn | En gång, sedan varje vecka | Fem tillgångar täcker nästan varje indie-lansering. Product Hunt anger sitt gallerimått i lanseringsformuläret, så kontrollera det där och återanvänd dina liggande bilder. - Open Graph 1200×630: 1200 × 630 - X-header 1500×500: 1500 × 500 - X-inlägg 1600×900: 1600 × 900 - Stående 1080×1350: 1080 × 1350 De fyra formerna ritade i skala. Headern är en tunn remsa, och ett stående inlägg tar mycket mer av en mobilskärm än ett liggande. ## Börja med Open Graph-bilden Open Graph-bilden är bilden som visas när någon klistrar in din länk. Det är den mest sedda grafik du någonsin gör, eftersom varje delning, varje svar med din URL och varje nyhetsbrevsomnämnande bär den. Utan en visar plattformar ett tomt grått kort eller ett slumpmässigt utsnitt av din sida. Alla regler finns i [Open Graph-bildens storlek](https://gradiently.design/sv/guide/open-graph-image-size); kortversionen är 1200×630, produktnamn, en rad, stor text i mitten. En länkförhandsvisning på 1200 gånger 630 med texten Fakturor som jagar sig själva och produktnamnet Paperweight ovanför En Open Graph-bild för en påhittad faktureringsapp: namn, löfte, inget mer. Den läses fortfarande när den krymps till en miniatyr i ett svar. Lägg sedan till taggarna i sidans huvud. De flesta ramverk har en plats för dem, men det här är de som spelar roll: ```html ``` Använd en absolut URL för bilden. Lägg en version i filnamnet, eftersom plattformar cachar förhandsvisningar och ett nytt namn tvingar fram en ny. Om din produkt har många sidor värda att dela, som publika profiler eller rapporter, generera en bild per sida i stället för en för hela webbplatsen. De flesta ramverk kan rendera dem på begäran från en mall. ## Skriv orden innan du väljer färger Indie-lanseringsgrafik misslyckas mycket oftare på orden än på utseendet. En mening som ”produktivitetens framtid” säger en skrollande främling ingenting. En användbar rad nämner jobbet och personen: vad som förändras för dem på måndag. Skriv tio versioner, läs dem högt och behåll den enklaste. [Skriva text till bilder](https://gradiently.design/sv/guide/writing-copy-for-visuals) har fler sätt att korta ned en rad. ### Undvik - ”Produktivitetens framtid” - ”AI-driven plattform för moderna team” - ”Version 1.0 är live” utan antydan om vad det är - Sex funktioner packade i en bild - En hel skärmdump där gränssnittets text inte går att läsa ### Gör så här - ”Fakturor som jagar sig själva” - ”Driftlarm som sms:ar dig först” - ”Live idag” plus den enda raden som förklarar det - En funktion per bild, i en följd - Ett tätt utsnitt av en del av gränssnittet, förstorat ## Välj ett utseende och behåll det på alla tillgångar Indie-produkter flyter ihop eftersom så många väljer samma violett-till-blå gradient och samma geometriska sans. Det går bra för ett helgprojekt och är ett problem för något du vill att folk ska minnas. Välj en bottenfärg, ett ljus eller en accent och ett typsnitt, och använd dem överallt: webbplatsen, OG-bilden, headern, varje inlägg. Ett utseende du upprepar i månader är det som får en enmansprodukt att kännas som ett företag. - Mörk botten, blågrönt ljus: `radial-gradient(circle at 80% 20%, #14b8a6 0%, #134e4a 35%, #05100f 75%)` - Varmt papper: `linear-gradient(160deg, #f8f4ec 0%, #efe6d6 60%, #e2d3bb 100%)` - Mörk botten, glödande ljus: `radial-gradient(circle at 20% 80%, #f97316 0%, #7c2d12 40%, #1c0a05 80%)` Tre utgångspunkter som undviker den vanliga violetten. En mörk botten med en upplyst färg passar utvecklarverktyg; varmt papper passar skriv- och finansprodukter. Om du hellre inte blandar egna är en Mark från [Gradiently Marknaden](/market) en färdig levande bakgrund med sin egen typografiska röst. Du kan designa med vilken ledig Mark som helst gratis; när du säkrar den blir du dess enda ägare, så bara du kan exportera med den och din lansering kan aldrig matcha en annan grundares. Att säkra är en engångsbetalning som inkluderar första året av att behålla den, varefter det är gratis med Pro eller kostar en årsavgift per Mark. Den renderas färsk i varje storlek och dess lugnaste yta flyttar sig bakom dina ord, vilket håller en livlig bakgrund läsbar utan rutor eller skuggor. ## Build in public-inlägg som folk känner igen i flödet En veckouppdatering är ryggraden i build in public. Använd samma layout varje vecka, så att följare vet att det är ditt innan de läst ett ord. Inled med en verklig siffra eller en verklig lärdom, och posta de långsamma veckorna också: en ärlig platt vecka ger mer förtroende än en rad segrar. Dela bara siffror som är sanna. Ett stående build in public-kort med texten Vecka 14, Första 100 användarna, och en rad som lovar vad som funkade och inte funkade En milstolpsvecka: siffran är rubriken, detaljen lovar berättelsen i inläggstexten. Ett stående build in public-kort med texten Vecka 15, Tre saker jag lanserade, som listar mörkt läge, CSV-import och snabbare sök En leveransvecka i samma ram. Samma bakgrund, samma typografi, så att serien läses som en. Gör en månads värde av dessa i ett svep i stället för ett varje fredag. [Skapa innehåll för sociala medier i omgångar](https://gradiently.design/sv/guide/batch-create-social-media-content) går igenom metoden. Ge stora ögonblick, som lanseringsdagen eller en intäktsmilstolpe, en egen layout så att de sticker ut från veckorytmen. ## Din X-header och profil X-headern är 1500×500. Din profilbild ligger över dess nedre vänstra hörn och remsan beskärs olika på mobiler, så håll orden i mitten och mot höger. Sätt produktnamnet, den enda raden och URL:en där, eller bara ditt utseende. Exakta säkra ytor finns i [X-headerns storlek](https://gradiently.design/sv/guide/x-header-size). En bred X-header med texten Bygger Paperweight öppet och en webbadress under, till höger om mitten En header som gör ett jobb: berättar för en besökare vad du bygger. Orden ligger mitt till höger, fria från profilbilden. ## En checklista för lanseringsveckan 1. **Två veckor innan: OG-bild och header** Publicera metataggarna och klistra in din URL i ett privat meddelande till dig själv för att se den riktiga förhandsvisningen. 2. **En vecka innan: orden** Skriv den enda raden och tre funktionsrader. Varje funktionsrad blir en egen bild. 3. **Designa en huvudram** Gör lanseringsinlägget i 1600×900 med ditt utseende, din rad och ett utsnitt av gränssnittet. 4. **Gör de andra måtten utifrån den** Lägg ut samma design på nytt i 1080×1350 för LinkedIn och Threads och 1080×1920 för stories, i stället för att beskära, med storyns ord inom den centrala [säkra zonen](https://gradiently.design/sv/guide/social-media-safe-zones). [Anpassa för varje plattform](https://gradiently.design/sv/guide/one-look-every-size) förklarar varför. 5. **Lanseringsdagen: en bild per inlägg** Posta, fäst det på din profil, svara alla. Håll Product Hunt-galleriet i samma utseende så att besökare som kommer från endera stället ser en produkt. 6. **Veckan efter: tacka folk** Dela vad som hände med verkliga siffror och vad du fixar härnäst. Det inlägget når ofta längre än lanseringen. För den bredare bilden av en lansering, se [lanseringsgrafik för produkter](https://gradiently.design/sv/guide/launch-day-graphics) och, om du säljer mjukvara, [SaaS-varumärkesbyggande](https://gradiently.design/sv/guide/saas-startup-branding). Om du tillbringar lanseringsveckan i din editor fungerar Gradiently också inuti ChatGPT, Claude och andra assistenter som stöder fjärr-MCP-servrar: be assistenten du redan har öppen om lanseringsinlägget, så öppnas designen i Studion för en sista kontroll. Installationen finns på [MCP-sidan](https://gradiently.design/sv/developers/mcp). > **Testa varje förhandsvisning innan du postar** Plattformar cachar länkförhandsvisningar i flera dagar. Kontrollera din i ett privat meddelande först, och om du byter bild senare, byt även dess filnamn. ## FAQ ### Vilken storlek ska en Open Graph-bild ha? 1200×630 pixlar. Håll orden stora och centrala, eftersom bilden ofta visas som en liten miniatyr. ### Vilken storlek har en X-header? 1500×500 pixlar. Profilbilden överlappar det nedre vänstra hörnet, så håll texten i mitten och mot höger. ### Behöver jag en formgivare för en Product Hunt-lansering? Nej. Du behöver en tydlig beskrivning på en rad, ett enhetligt utseende och några liggande bilder som var och en visar en funktion, vilket du kan göra själv på en kväll. ### Vad ska ett build in public-inlägg innehålla? En verklig siffra eller en verklig lärdom som rubrik, samma layout varje vecka och berättelsen i inläggstexten. Dela långsamma veckor lika ärligt som goda. ### Hur håller jag lanseringsgrafiken enhetlig? Välj en bakgrund, ett typsnitt och en layout, och designa varje storlek från samma huvudram i stället för att beskära en enda bild.