Adobe ha una relazione interessante con le persone che progettano siti web. Photoshop e Fireworks ti hanno coperto da una prospettiva di immagine statica, ma gli strumenti per creare siti Web dal vivo e funzionanti sono un'altra storia completamente. Flash non è più il manifesto delle moderne tecnologie web (al contrario), GoLive ha fatto la fine dei dinosauri e Dreamweaver, sebbene ancora ampiamente utilizzato, è considerato da molti un pasticcio gonfiato.
Una delle aree su cui Adobe intende perseguire è il web design per i non-programmatori. Hanno fatto la loro missione per portare il mondo della creazione di siti web professionali al grande mercato di designer che non sanno scrivere una lettera di codice. Finora, sono in gran parte venuti meno da questo obiettivo (Project Rome anyone?). Il loro ultimo tentativo, Adobe Muse, è finalmente uscito dalla versione beta ed è disponibile come parte del nuovo servizio Creative Cloud di Adobe ($ 50 al mese) o come prodotto indipendente ($ 15 al mese). Muse vale il tuo tempo e denaro? Ti permetterà davvero di creare siti web di livello professionale senza codifica? Continuate a leggere per scoprirlo.
Una lunga venuta
Ho scritto molto sulla strada di Adobe per pubblicare Muse. Nel 2010, ho discusso sul motivo per cui Project Rome era molto meno utilizzabile per i designer seri. Molte delle idee di quel progetto sono state introdotte nella beta di Muse, che mi ha lanciato un accenno sul motivo per cui Adobe non comprende i web designer.
Data la mia storia sull'argomento, questo articolo vale anche la pena leggerlo? Non sarò prevedibilmente bash di Adobe e Muse e ti dirò di usare Flux o il codice a mano invece?
Sì e no. Penso che Adobe abbia trovato il soluzione che il settore stava aspettando? Non da remoto. Tuttavia, Muse ha un sacco di merito. C'è molto che mi piace davvero oltre a ciò che penso possa migliorare. Dirò questo: Adobe è più vicino che mai. Per capire perché, continua a leggere.
Un inizio debole
Ho scaricato la mia prova di trenta giorni di Muse, l'ho lanciata, ho scelto di creare un nuovo sito e mi sono ritrovato a guardare questa finestra.
Ero già deluso. Dal primo passo, Adobe mi sta costringendo a una mentalità di larghezza statica. I progettisti di stampa potrebbero trovarlo familiare, ma ignorano palesemente lo stato attuale del web design, che sta viaggiando rapidamente nella direzione delle larghezze dei fluidi e dei punti di rottura guidati dalle media query (responsive web design).
Ecco un altro problema che ho avuto con questa finestra di dialogo: non ci sono unità. La larghezza della pagina predefinita che appare è 960. 960 cosa? Pixel? Pollici? Unità di circonferenza? Esperti veterani del Web presumono che si tratti di un valore basato su pixel, ma questa app non è pensata per veterani esperti, ma è pensata per i neofiti che hanno bisogno di più informazioni rispetto a ciò che viene offerto qui.
Ero anche confuso riguardo le opzioni di margine e di riempimento presentate a me. Stavo impostando valori globali per margini e spaziatura? Perché dovrei farlo? Quando eseguo il codice manualmente, di solito azzeramento di questi valori, è quello che dovrei fare qui? Si scopre però che questi valori sono per il tuo contenitore principale. Ancora una volta, un po 'più di informazioni farebbe molto.
Non è poi così male. Mi piace davvero che tu possa configurare le colonne subito. In realtà questo equivale solo ad alcune guide che vengono schiaffeggiate sulla pagina, ma questa è una buona cosa. Mi piace che creare una griglia non significhi che sono costretto ad attenervisi in tutte le circostanze.
Incontra Muse
L'interfaccia di Muse è abbastanza familiare che saprai come muoverti se usi altri prodotti Adobe. C'è un pannello posizionabile di strumenti sulla destra, una striscia di pulsanti e opzioni lungo la parte superiore e la tua tela principale al centro.
L'app è stata creata in AIR, che mi infastidisce come utente Mac. Il risultato è qualcosa che sembra quasi nativo, ma si sente molto diverso da un'applicazione Mac dedicata. Questo porta a molte stranezze frustranti. Ad esempio, il pannello principale assomiglia molto a qualcosa che vedresti in Photoshop.
Di conseguenza, ti aspetti che funzioni allo stesso modo. Sfortunatamente, questo pannello non può essere ancorato al lato dello schermo come se fossi abituato, il che significa che si sente sempre nel modo. È possibile ridurlo a una striscia di icone, ma collassa a sinistra, quindi la posizione di destra predefinita diventa un punto debole.
Non importa, puoi semplicemente spostarlo a destra e tenerlo collassato per salvare spazio. Come in Photoshop, facendo clic su un'icona si espande solo quella parte del pannello, oh aspetta, no. Invece espande l'intero pannello, che vanifica completamente lo scopo della striscia di pulsanti.
Andando avanti, sotto puoi vedere alcune delle opzioni e pulsanti che risiedono lungo la parte superiore dell'interfaccia. Ci sono tre modalità di visualizzazione principali: il piano mostra tutte le pagine in una struttura, il design è dove si fa il tuo edificio e l'anteprima è dove vedi un'anteprima web in-app dal vivo del tuo sito (premi Comando-Maiusc-E per visualizzare l'anteprima nel browser).
Vicino al centro di questo pannello superiore si trova la normale barra mobile contenente i seguenti elementi: Strumento selezione, Strumento ritaglio, Strumento testo, Strumento Zoom, Strumento mano e Strumento rettangolo. Questo è anche il luogo in cui applichi vari stili, aggiungi link, ecc.
Costruire una pagina Web
Da qui, il flusso di lavoro è abbastanza intuitivo. Se vuoi inserire del testo, prendi lo strumento di testo. Se vuoi disegnare una scatola, usa lo strumento rettangolo; è così facile Come programmatore, mi spaventa non poter impostare manualmente i parametri per gli elementi che aggiungo, ma suppongo che mantenga le cose semplici. Ad esempio, se voglio impostare un paragrafo a 300px di larghezza, devo solo eyeballarlo o utilizzare la mia griglia. E dimentica il modello della scatola, infili le cose dove vuoi.
Una cosa che Muse fa piuttosto bene è l'integrazione con Photoshop e Fireworks.È possibile posizionare un file da una di queste app, tornare indietro e apportare modifiche e le modifiche verranno aggiornate automaticamente in Muse.
Una delle cose che pensavo fosse un po 'goffo stava lavorando con la tela. Non riuscivo a capire come selezionare semplicemente lo sfondo. Si scopre che è sufficiente fare clic su di esso, ma non c'è davvero alcun riscontro visivo per dirti che hai capito bene.
Da qui puoi applicare un riempimento o un'immagine di sfondo con tutte le opzioni che ti aspetteresti. Se stai lavorando con un oggetto, puoi applicare sfumature e ombre, definire gli stati di passaggio del mouse, arrotondare gli angoli, aggiungere collegamenti ad altre pagine, ecc.
Il flusso di lavoro di Muse: il bene e il male
C'è molto su Muse che Adobe ha ragione. È davvero facile da riprendere e correre. Ho capito praticamente tutto ciò di cui avevo bisogno senza alcuna istruzione esterna di sorta. Penso che i non-programmatori lo apprezzeranno davvero come qualcosa di più potente del tipico WYSIWYG senza essere schiacciante come qualcosa come Dreamweaver.
Per lo meno, è un ottimo modo per creare mockup di siti Web e la sua fascia di prezzo la colloca in un'area che è alquanto competitiva con i servizi di wireframing online che offrono molto meno.
Ora, dal punto di vista di un programmatore, c'è molto che cambierei. So che l'app non è costruita per i programmatori e forse dovrebbe rimanere così, ma ciò non significa che non dovrebbe condividere i costrutti usati per costruire pagine web. La metafora qui è rotta. Adobe deve smettere di costruire app per il layout di pagina con funzionalità web e invece creare un front end visivo per il processo di codifica.
Lavorare con gli oggetti dovrebbe essere molto più strettamente correlato a lavorare con i CSS di quanto non sia qui. Dovrei essere in grado di impostare il colore con RGBa, definire i margini e il riempimento di un pulsante, impostare la larghezza di un paragrafo sul 30% della finestra del browser e creare una famiglia di caratteri, ma non posso fare nulla di tutto ciò. Adobe ha scelto familiarità e finzione sui costrutti del web design e penso che siano dalla parte sbagliata di quel recinto.
Il codice
Dopo aver conosciuto l'interfaccia, ho aperto una pagina molto semplice in modo da poter vedere come è il processo e, soprattutto, dare un'occhiata all'output. Ecco cosa mi è venuto in mente (fai clic sull'immagine per vedere la demo dal vivo):
Quando esegui il check-out della demo, assicurati di premere su Visualizza sorgente per poter dare un'occhiata al codice che è stato generato. Ho mantenuto semplice la progettazione della pagina per un motivo: così ho potuto vedere se il codice risultante era anche semplice. Una pagina come questa userebbe una quantità minima di handcoding e dovrebbe essere abbastanza facile da capire se è possibile scrivere codice o meno.
La buona notizia è che Muse esporta HTML e CSS, quindi per fortuna l'idea di Flash è morta con Project Rome. Prevedibilmente, il codice risultante è estremamente pesante. Usando il menu di navigazione predefinito, ogni collegamento utilizza un elemento di elenco e non uno, ma due div.
Per la maggior parte, le classi hanno nomi semplici applicati, ma i nomi ID sono inutili e vaghi (esempio:? U154-4?). Complessivamente, è lontano dalla peggiore uscita WYSIWYG che ho visto. Posso ancora leggerlo facilmente e vedere la struttura. È sicuramente gonfio, ma è sufficiente per far sì che un programmatore faccia roteare i suoi occhi invece di un abominio che lo farà rimproverare la tua stessa esistenza.
Quindi vale la pena?
Nel titolo di questo articolo ho promesso di dirti se Muse ha un valore di $ 15 al mese. È difficile rispondere a questa domanda semplicemente perché mi chiedo a chi è rivolto il prodotto. Se progetti di costruire siti per vivere, questa non è la strada da percorrere. Se vuoi semplicemente gestire il tuo piccolo sito, avere una tariffa mensile semplicemente per possedere il software non è esattamente una prospettiva elettrizzante.
Bottom line: Muse vale i soldi? nel breve periodo. Nei primi mesi, avrai un ottimo software con pochissima spesa. Tuttavia, utilizzando il modello di abbonamento, dopo due anni, avrai pagato circa $ 360 per Muse. A mio parere, ciò spinge il limite superiore di ciò che il software è veramente utile a questo punto. Questo potrebbe cambiare con l'arrivo degli aggiornamenti, ma se non ci sono miglioramenti significativi, semplicemente non sembra valga la pena nel lungo periodo quando RapidWeaver è $ 80 e Flux è inferiore a $ 150 (entrambe le opzioni solo Mac purtroppo).
Come Adobe potrebbe renderlo migliore
È interessante notare che RapidWeaver potrebbe essere un modo migliore per andare. Con la sua struttura rigida basata su template, RapidWeaver è lontano da tutto ciò che si usa per costruire un sito da zero. Tuttavia, Rapidweaver ha un ricco mercato di plug-in di terze parti in grado di spingerlo alla grandezza ben oltre la rigidità predefinita. Con Blocchi e pile, Rapidweaver diventa un'impressionante costruttore di siti a forma libera.
Questo mi dà un'idea di come Muse possa essere migliorato molto con pochissimo sforzo. Adobe dovrebbe prendere una pagina dal libro RapidWeaver e aprire un marketplace dove gli utenti possono fornire plugin. In questo modo gli utenti decidono cosa manca e come deve essere integrato. Se voglio usare Muse per costruire pagine web reattive, dovrei semplicemente scaricare un plugin che aggiungerebbe la funzionalità mancante. Certo, preferirei che Adobe comprendesse solo il settore del web design e costruisse uno strumento che si adatta meglio al mercato, ma al posto di questa opzione prenderei un mercato di plugin simile a RapidWeaver.
Cosa pensi?
Ora che hai visto la mia interpretazione di Muse, mi piacerebbe sentire la tua. Pensi che Adobe abbia finalmente inchiodato l'idea del web design senza codice o stia ancora calpestando l'acqua, spingendo fuori prodotti che non stanno portando avanti il settore?
Ancora più importante, in che modo Adobe può riorientare i propri sforzi e creare un prodotto che ti piacerebbe sborsare $ 15 al mese da utilizzare?