Content
- Les millors eines de wireframe
- 01. UXPin
- 02. Adobe XD
- 03. Axure RP
- 04. Maquetes de Balsamiq
- 05. Esbós
- 06. Photoshop
- 07. Justinmind
- 08. Wireframe.cc
- 09. Invision Studio
- 10. InDesign
Les millors eines de wireframe us permeten clavar el disseny del vostre lloc web o aplicació des del primer moment. En aconseguir que tots els grups d’interès estiguin d’acord sobre el funcionament de la vostra interfície d’usuari, el procés d’adquisició s’aconsegueix al principi. I això és vital per racionalitzar el procés i evitar girs i inversions equivocades en el camí.
Algunes de les millors eines de wireframe fetes específicament pensant en el wireframing. Quina d'aquestes opcions depèn en gran mesura de si voleu crear alguna cosa ràpida i aproximada, o alguna cosa més proper a un prototip completament funcional.
A l’altra cara de la moneda, algunes persones no volen la molèstia d’exportar els seus dissenys des d’una aplicació dedicada d’emmarcament de filferro a una aplicació de disseny complet. En lloc d’això, prefereixen construir els seus filferros dins d’un programari de disseny per a usos generals, de manera que puguin desenvolupar-ho tot en una plataforma de principi a fi. (Recordeu, podeu desenvolupar un lloc amb un mínim enrenou mitjançant un creador de llocs web).
Tenim recomanacions als dos camps. L’hem reduït a 10 de les millors eines d’emmarcat per cable. Per obtenir eines més útils, consulteu el nostre resum d'eines de disseny web, aquesta llista de les principals eines de disseny de la IU o els nostres millors ordinadors portàtils per a la programació.
Les millors eines de wireframe
01. UXPin
La millor eina de wireframe en general
Plataforma: Navegador web | Prova gratuïta: Sí | Preu: Des de 19 dòlars per editor al mes
Interfície intuïtiva Lectors Sketch i fitxers PS Eines de presentació principals No hi ha versió gratuïtaUXPin és una eina dedicada per emmarcar cables que té una interfície molt intuïtiva, amb icones clares i una sòlida biblioteca d’elements d’interfície d’usuari que podeu arrossegar i deixar anar als vostres filferros, així com components per a Bootstrap, Foundation, iOS i Android. Podeu importar i exportar fitxers a Sketch i Photoshop, cosa que us ofereix l'opció de desenvolupar els vostres filferros en prototips complets més endavant.
També hi ha algunes excel·lents funcions de col·laboració per treballar amb els vostres wirefrrams amb altres, i eines de presentació en viu de primera categoria per mostrar els vostres dissenys als grups d'interès. Fàcil de recollir per a principiants i ple d’eines avançades per als més experimentats, UXPin és la nostra millor eina de wireframe en general.
02. Adobe XD
La millor eina de disseny complet per emmarcar amb filferro
Plataforma: MacOS, Windows, Android, ioS | Prova gratuïta: No, però versió gratuïta limitada | Preu: Des de 9,98 GBP al mes (aplicació única) o 49,94 GBP al mes com a part de Creative Cloud
Integració multiplataforma de Creative Cloud Funcions avançades La versió completa requereix subscripcióLlançat com a competidor directe a Sketch, Adobe XD és una eina de disseny basada en vectors que està disponible tant per a Mac com per a Windows. És totalment interoperable amb altres eines d’Adobe com Photoshop i Illustrator, així com serveis com Adobe Fonts i Adobe Stock. I està molt enfocat a facilitar el disseny dels marcs de filferro als dissenyadors; des de la creació de mapes de llocs, diagrames de flux i storyboards fins a la creació de prototips funcionals.
Entre les funcions destacades s’inclou una ‘Repet Grid’ per al disseny ràpid, l’animació automàtica, els activadors de veu i les eines de col·laboració sòlides. Podeu provar Adobe XD de forma gratuïta, però necessiteu una subscripció a Creative Cloud per accedir a tota la gamma de funcions.
03. Axure RP
La millor eina dedicada a wireframe per a professionals UX
Plataforma: MacOS, Windows | Prova gratuïta : Sí | Preu: Des de 25 dòlars (pro) per usuari i mes
Construeix prototips de treball Funcions avançades La corba d'aprenentatge Pot ser excessivaAxure us permet no només crear filferros de baixa fidelitat, sinó afegir funcionalitats addicionals i crear-ne d’altres d’alta fidelitat. Podeu utilitzar-lo per crear maquetes HTML interactives tant per a llocs web com per a aplicacions, i visualitzar el disseny de l'aplicació al telèfon amb una funció compartida integrada.
Utilitzat per organitzacions com Microsoft, Amazon i la BBC, aquest programari inclou funcions d’anul·lació de símbols, un mode d’inspecció per a desenvolupadors, efectes d’animació, emmagatzematge i compartició al núvol, exportació de CSS i documentació. Una opció fantàstica per a professionals experimentats en UX que vulguin lliurar els seus dissenys als desenvolupadors.
04. Maquetes de Balsamiq
La millor eina de wireframe per a dissenys low-fi
Plataforma: Mac, Windows, Linux, navegador web | Prova gratuïta: Sí | Preu: Des de 89 dòlars per a un usuari per a escriptori; a partir de 9 dòlars al mes per a la versió web
Ràpid d’utilitzar Manté les coses senzilles Petita corba d’aprenentatge Només filferros de baixa fidelitatBalsamiq Mockups facilita la recollida i la creació de marcs de filferro, encara que no tingueu experiència prèvia. El recomanaríem per a tothom que vulgui muntar per reunir una armadura ràpida i de baixa fidelitat, en lloc d'un prototip polit.
El programari inclou diversos elements d'arrossegar i deixar anar, des de botons fins a llistes, cadascun amb un estil de dibuix a mà, i podeu veure l'aspecte del vostre filferro en diverses mides de pantalla. Amb eines de col·laboració i proves d’usuaris molt ben integrades, aquesta és una opció fantàstica tant per a equips no tècnics com per a equips d’UX prims.
05. Esbós
Eina de disseny completa amb un fort enfocament de la IU
Plataforma: Mac | Prova gratuïta: Sí | Preu: $99
Enfocament fort de la interfície d'usuari Interfície lleugera i intuitiva Només MacTot i que Sketch no està disponible per a Windows, sens dubte val la pena considerar-lo si sou usuari de Mac. Des del seu llançament el 2010, ha revolucionat tot el mercat d’emmagatzematge de filferro i eines de prototipatge i, actualment, continua centrat en làser en la interfície d’usuari i el disseny de vectors d’icones. Lleugera i fàcil d'utilitzar, la seva interfície és molt senzilla i intuïtiva.
Sketch és una eina fantàstica per fer marcs de filferro senzills, amb la funció Símbol que permet repetir elements automàticament a través del disseny. Hi ha infinitat de kits d’interfície d’usuari de tercers per descarregar si voleu crear un prototip complet. I, a diferència de les aplicacions d’Adobe, està disponible per una tarifa única sense subscripció.
06. Photoshop
L’estàndard de la indústria per al disseny digital
Plataforma: Windows, Mac | Prova gratuïta: Sí | Preu: A partir de 19,99 dòlars al mes com a part d’Adobe Creative Cloud
Estàndard de la indústria Integració creativa al núvol Biblioteques d’elements que no tenen recursosPhotoshop és l’estàndard de la indústria pel que fa al disseny de programari en general. No hi ha cap funció específica d’emmarcat per cable; per exemple, no ofereix biblioteques d'elements d'interfície. Però no hi ha cap raó per què no el pugueu utilitzar per emmarcar amb filferro. De fet, com que està molt ben integrat amb altres eines d’Adobe i serveis com ara Adobe Fonts i Adobe Stock, és possible que trobeu Photoshop la millor eina de wireframe per a vosaltres. Sobretot si ja esteu familiaritzat amb el programari. I està ple de tantes funcions que podeu fer des d’esbossar idees ràpides fins a agrupar diversos elements i capes per construir un wireframe robust.
07. Justinmind
La millor eina de prototipus i wireframe per a no tècnics
Plataforma: Mac OS, Windows | Prova gratuïta: No, però versió gratuïta limitada | Preu: Des de 19 dòlars al mes
Construeix prototips de treball Apte per a principiants Versió gratuïtaCorba d’aprenentatgeJustinmind és una altra eina que us permet construir des de marcs metàl·lics fins a prototips de treball, però és més adequat per a persones que no són tècniques que Axure RP. Inclou una biblioteca d’elements d’interfície d’usuari, des de botons i formularis fins a formes genèriques i una gamma de ginys per a iOS, SAP i Android.
S'inclou un estil personalitzat, de manera que podeu afegir cantonades arrodonides, imatges retallades o degradats de color o importar gràfics arrossegant-los al navegador. Els prototips es poden exportar com a HTML. Fins i tot hi ha una versió limitada que és gratuïta per sempre.
08. Wireframe.cc
La millor eina wireframe al navegador
Plataforma: Navegador web | Prova gratuïta: Sí | Preu: A partir de 16 dòlars al mes
Simplifica les coses Elimina les distraccions Res per descarregar Les funcions de Lacks (encara que a propòsit)Hi ha una dita popular en els negocis coneguda com el principi KISS: "Mantingueu-ho senzill, estúpid". I si esteu adoptant aquest enfocament per emmarcar amb fils, és possible que Wireframe.cc sigui la millor opció per a vosaltres.
Aquesta eina basada en navegadors ofereix una interfície senzilla per esbossar els vostres marcs de filferro i defuig les barres d’eines i les icones d’una aplicació típica, de manera que no hi ha res que us alenteixi. Hi ha una paleta de colors limitada que us ajudarà a evitar aquesta via particular de postergació i els elements de la interfície d’usuari són sensibles al context i només apareixen quan els necessiteu.
09. Invision Studio
Dissenyeu programari amb una forta col·laboració i funcions de resposta
Plataforma: Windows, Mac | Prova gratuïta: No, però un pla gratuït limitat | Preu: Des de 13 dòlars al mes
Fàcil d'usar S'integra amb la versió gratuïta d'Invision Freehand No s'integra amb moltes einesÉs possible que Invision Studio no sigui tan ric en funcions com Adobe XD, però per crear filferros té tot el que necessiteu. És particularment fort en les funcions de disseny sensibles i s’integra molt bé amb Invision Freehand per col·laborar en temps real amb altres persones.
La interfície és bastant fàcil d’aprendre i les icones precarregades són molt elegants i de bon disseny. Amb funcions útils com ara comentaris, transicions i sincronització d’escriptori, aquesta és una eina molt capaç de crear des de sistemes de filferro de baixa fidelitat fins a prototips amb funcions completes.
10. InDesign
Eina d’edició automàtica ideal per fer marcs de filferro
Plataforma: Windows, Mac | Prova gratuïta: Sí | Preu: A partir de 19,99 dòlars al mes com a part d’Adobe Creative Cloud
Dissenyeu PDF interactius Creeu les vostres pròpies biblioteques Integració creativa al núvol Manca biblioteques d’elementsAdobe InDesign ha estat durant molt de temps el programari d’edició automàtica més popular. Però actualment ja no es centra només en el disseny d’impressions. La versió més recent es pot utilitzar per crear PDFs interactius molt atractius, incloses animacions, estats de vídeo i objectes. I, tot i que les funcions digitals d’InDesign s’utilitzen principalment per crear llibres electrònics, fullets electrònics i revistes electròniques, són igualment capaços d’elaborar marcs de filferro i maquetes. El programari també inclou la possibilitat de crear llibreries d'elements de pàgina, de manera que també podeu crear col·leccions de gràfics de la IU reutilitzables.