Dribbble-shot: storlek 1600×1200 och inramning

Storleken på en Dribbble-shot är 1600×1200 pixlar, en liggande 4:3-ruta. Dribbble visar varje shot som en 4:3-ruta i sitt rutnät, så designa den första bilden så att den går att läsa i den lilla storleken: en idé, beskuren nära, med utrymme runt och en bakgrund som klär arbetet i stället för att kämpa mot det. Ytterligare bilder i en shot kan visa detaljer. Håll inramning och bakgrund enhetliga från shot till shot så läses din profil som en portfolio i stället för en hög uppladdningar.

Mått för Dribbble-shots

Ladda upp i exakt 4:3. Ett annat format beskärs eller fylls ut i rutnätet, och Dribbble bestämmer var, vilket sällan är där du själv skulle välja. PNG håller gränssnittskanter och text skarpa, JPG passar fotografiskt arbete.

Så ramar du in arbete i en Dribbble-shot

En klassisk svag shot är en hel webbsida som krympts in i ramen. I miniatyrstorlek blir den en grå rektangel med prickar. Välj en del som är värd att se, beskär till den och ge den utrymme.

1. 1

   Välj en idé

   En enda skärm, en komponent, en logotypuppställning eller en ikonuppsättning. Om det behöver ett stycke för att förklaras är det två shots.

2. 2

   Beskär närmare än vad som känns naturligt

   Visa kassakortet, inte hela kassasidan. Detaljer som spelar roll ska vara tillräckligt stora för att synas i rutnätet.

3. 3

   Lämna en marginal

   Ungefär 10 till 15 procent av ramen på varje sida, cirka 160 till 240 pixlar över en shot på 1600 pixlar, låter arbetet andas.

4. 4

   Välj en stödjande bakgrund

   Enkel eller mjukt tonad, vald ur eller mot arbetets palett. Bakgrunden ska få arbetet att se bättre ut och sedan försvinna.

5. 5

   Lägg till detaljbilder efteråt

   Använd andra och tredje bilden för närbilder, lägen och hela flödet. Den första bilden är inbjudan.

Bakgrunder för Dribbble-shots

Bakgrunden är scenen. Ett ljust gränssnitt ser ofta bäst ut på en mjukt tonad botten som är något mörkare än dess egen vita, så att kortens kanter syns. Ett mörkt gränssnitt vill ha en djup botten med en mild färghöjning nära. Ljust varumärkesarbete kan ligga på en nästan neutral yta så att varumärkesfärgen är det enda högljudda i rutan.

Enhetsmockups kan hjälpa när sammanhanget spelar roll, som en mobilapp i en hand eller en klockskiva på en handled. Används de på varje shot krymper de arbetet och ser snabbt daterade ut. En ren platt skärm på en bra bakgrund är oftast starkare. Gradientbakgrunder och mörka gradientbakgrunder går igenom hur du gör bottnar som inte ser ut som förinställningar.

Få din Dribbble-profil att se ut som en portfolio

Besökare bedömer en profil efter dess rutnät. Om varje shot delar bakgrundsfamilj, marginal och sätt att beskära ser rutnätet kurerat ut, och det är ditt arbete, inte din inramning, som ändras från ruta till ruta. Tips för designportfolio och design av fallstudier för samma tänkande in i en hel portfolio.

Ge varje shot en enkel titel som säger vad den är, ”Onboarding i bankapp” snarare än ”Fräscha vibbar”, och en kort beskrivning av problemet och ditt beslut. Folk hittar shots via sökning och taggar, och kunder läser beskrivningen för att bedöma hur du tänker, inte bara hur du ritar.

En bakgrund som ingen annan använder är en tyst signatur. I Gradiently är Dribbble-shot en inbyggd storlek, och en Mark du säkrar är bara din att exportera med, så scenen bakom dina shots kan inte dyka upp på en annan designers profil. Med Pro kan du exportera stillbilder upp till 4K eller en kort MP4 när Markens långsamma rörelse passar en animerad shot. För rörelseshots i allmänhet, håll loopar korta och milda. Animerade gradientbakgrunder har principerna.