Luke Wroblewski a dat numele firmei în 2009, dar logica era deja evidentă. Telefoanele deveniseră principala modalitate prin care oamenii accesau internetul, iar proiectarea layout-urilor pentru desktop-uri i-a obligat mai întâi pe designeri să înghesuie complexitatea în ecrane mici, apoi. „Mobile-first” inversează ordinea. Începeți cu cel mai mic ecran, decideți ce contează cel mai mult, apoi extindeți-vă la layout-uri pentru tablete și desktop-uri.

Constrângerea este productivă. O fereastră de vizualizare îngustă forțează triajul. Navigarea se restrânge într-un meniu. Conținutul se mută într-o singură coloană. Fiecare caracteristică trebuie să își justifice spațiul. Designerii schițează ținte ușor de atingere cu degetul mare, iau în considerare utilizarea cu o singură mână și planifică conexiuni lente. Când designul crește pe un ecran mai mare, spațiul suplimentar este folosit pentru respiro și panouri secundare, în loc să fie umplut cu dezordine nouă.

Practici de bază

• Începeți wireframe-urile la lățimea telefonului.
• Prioritizează ierarhia conținutului fără milă.
• Designul tactil vizează cel puțin 44 de pixeli.
• Scalează la final pentru tabletă și desktop.

Designul responsiv și abordarea „mobile-first” merg adesea împreună. Designul „mobile-first” stabilește prioritatea. Designul responsiv se ocupă de adaptarea între punctele de întrerupere.