Intervju: Macaws Tom Giannattasio Talks Scarlet, arbetsflöde och levande designmiljöer
Ara är en av en ny ras av webbdesignverktyg. Det är ett av de första designapplikationerna som kan generera ren kod, och stöds av många branschfigurer.
Nu bygger teamet bakom Macaw på framgången med sin första produkt att förbereda sig för att starta ett andra verktyg som heter Scharlakansrött , med ett radikalt nytt arbetsflöde och en mängd nya funktioner.
Scarlet lovar att leverera mer än Macaw: Enligt laget är det en "levande designmiljö", och det kan vara ett revolutionärt steg i designapplikationens historia.
Vi började med Macaws Tom Giannattasio, för att fråga honom vad vi kan förvänta oss av deras senaste projekt ...
Webdesigner Depot: När du först bestämde dig för att bygga Macaw, vad var det som övertygade dig om att befintliga verktyg inte var tillräckligt bra?
Tom Giannattasio: Jag tror inte att våra verktyg någonsin har slagit märket. Jag lärde mig webbdesign tillbaka i tiden för Geocities-textområdet. Det var en eländig återkopplingslingstyp, något HTML, hit uppdatering, vänta på sidan för att ladda om, inser att du saknade en stängningsfäste, försök igen. Så småningom steg Photoshop som ett överlägset sätt att designa för webben och branschen delades in i dem som gjorde designen och de som gjorde utveckling.
Responsiv design hjälpte oss att inse att vi inte kan behandla nätet som om det var ett fast tvådimensionellt plan
Jag tror att vi nu upplever en återanslutning av dessa två discipliner. Responsiv design hjälpte oss att inse att vi inte kan behandla webben som om det var ett fast tvådimensionellt plan och designers letar efter nya sätt att arbeta. Många av dem har återgått till en textredigerare så att de kan arbeta direkt med mediet. Det är jättebra, men jag känner att vi är tillbaka i Geocities dagar igen. Jag vill driva saker framåt. Jag vill ha ett verktyg som låter mig arbeta direkt med webben på ett sätt som är visuellt och intuitivt. Därför började jag Macaw.
WD: Varför Scarlet, och inte Macaw 2.0?
TG: Ärligt talat trodde vi inte att det skulle vara rättvist för användarna att ringa Scarlet en version 2. Scarlet är inte en ompaketerad version 1 med några ytterligare funktioner som sänks ovanpå. Det är en helt annan applikation med ett omarbetat arbetsflöde. Den byggdes från grunden med en ny arkitektur och massor av nya funktioner. Vi ser en framtid där de två applikationerna arbetar tillsammans för att möta de olika behoven hos designers och utvecklare.
Vi måste utforma saker som agnostiska som möjligt för att tillåta människors preferenser att skina igenom
WD: Workflow är en av de mest omtvistade frågorna i webbdesign, eftersom den har så stor inverkan på slutprodukten. hur anlände du till arbetsflödet i Scarlet?
TG: Definiera arbetsflöde för en app som är gjord att användas i timmar i slutet är en knepig strävan. Du måste tillhandahålla tillräckligt med pengar för att hjälpa människor upp i inlärningskurvan, men inte så mycket att det blir i vägen för en superanvändare. Preference är en annan hinder. Vi måste utforma saker som agnostiska som möjligt för att tillåta människors preferenser att skina igenom utan att offra ansökningarna.
Dessa bland en miljon andra överväganden leder till en trial-and-error-loop som driver designprocessen på Macaw. Lyckligtvis är vi själva designare och utvecklare, så vi kan prototypa och testa idéer själva och veta om de är effektiva.
WD: Hur länge har du jobbat med Scarlet?
TG: Det har varit ungefär ett år nu, och jag är verkligen ganska stolt över vad vårt lilla lag har kunnat göra på så kort tid.
WD: Hur stor är ditt lag? Och är Scarlet byggt av webbdesigners, för webbdesigners?
TG: Det finns tre av oss på laget och vi växte alla med att designa för webben. Vi samarbetade på olika byråer och gjorde arbete för Apple, Oracle, MIT och andra stora organisationer, innan vi gick med i Macaw.
WD: Scarlet faktureras som en "Live Design Environment", vad är en levande designmiljö, och hur skiljer det sig från andra verktyg på marknaden?
Vi coined namnet Live Design Environment internt för att hjälpa oss att diskutera denna nya sort av verktyg
TG: Många verktyg passar snyggt in i en kategori: SublimeText är en textredigerare; Skiss är ett ritverktyg; Photoshop är en bildredigerare. Några av de nya verktygen som slår på marknaden gör det inte. Den enda kategorin som är till och med nära är WYSIWYG och jag kan inte tro att det fortfarande är en term vi använder. Det borde ha dött tillsammans med FrontPage.
Vi coined namnet Live Design Environment (LDE) internt för att hjälpa oss att diskutera den här nya sorten av verktyg, som inte alls är exklusivt för Macaw. Vi trodde att det skulle kunna hjälpa andra att differentiera, så vi bestämde oss för att dela den.
För oss beskriver en Live Design Environment i huvudsak två viktiga aspekter:
- En levande designyta. Det här skiljer verkligen dessa verktyg från något som Photoshop. De tillåter dig att arbeta med en faktisk webbläsarevisning, men de låter dig designa utan att behöva skriva kod. Detta liknar den traditionella WYSIWYG med undantag för nyckelaspekt nummer två ...
- En intelligent kodmotor. Stark webbdesign kräver mer än val av form, färg och typ. Det behöver väl konstruerad, välskriven kod för att göra det designarbetet. Vi anser att besluten bör fattas av designers, men de behöver inte vara handskrivna. Traditionella WYSIWYG-redaktörer levererar absolut positionering, slumpmässiga ID-skikt och vanligt sopor, men den här nya sorten av verktyg har funnit sätt att förbättra arbetsflödet för att ge dig en stark användbar kod. Det är en stor sak.
WD: Du pratar om standardkompatibel semantisk kod? Det är lätt att tänka sig för en grundläggande bloggwebbplats där du har en etablerad struktur och en enkel hierarki. Men kan Scarlet hantera mer än det, en företagsbroschyr eller till och med en e-handelsplats, till exempel?
TG: Scarlet är just nu fokuserad helt på klientsidan av saker (HTML, CSS och JS). Det är inte en out-of-the-box-lösning för e-handel och det hanterar inte något på serverns sida. Scarlet är inte heller en magisk låda som gör att du kan kasta idéer till ena sidan och få användbar kod ut den andra. Det är ett finjusterat instrument som hjälper dig att få exakt den kod du vill ha på ett sätt som är snabbare, mer konsekvent och mer intuitivt än handkodning.
WD: Scarlet ger fullständig åtkomst till koden den matar ut, och vi kan även redigera sina utmatade filer i vår föredragna kodredigerare. Betyder det att vi måste vara HTML / CSS / JavaScript-experter att använda Scarlet?
TG: Arbetsflödet är honat för att hjälpa proffsen att göra sitt arbete snabbare och mer intuitivt. Du kan säkert använda Scarlet utan stark kunskap om HTML och CSS, men du kommer inte att kunna fullt ut skörda dess fördelar. Din produktion motsvarar din ingång.
WD: Full CSS3-stöd är inbyggt i Scarlet, vad sägs om CSS4? Ska den visuella designaspekten av Scarlet hålla takt med framtida utveckling i HTML och CSS?
TG: Att hålla fast på snabba framsteg är säkert svårt. När vi bestämde oss för att bygga Scarlet var framtidsbestämning en av huvudhänsynen. Kärnan i appen är byggd abstrakt nog att allt vi verkligen behöver göra för att lägga till nya funktioner är ansluta ett användargränssnitt till det. Så länge som de grundläggande principerna för HTML och CSS håller sig intakta, borde vi fina roller med framstegen.
WD: Hur hanterar Scarlet preprocessorer som Sass eller Less? Vad sägs om postprocessorer?
TG: Just nu gör det inte. Vi vet att det är en mycket eftertraktad funktion. Arkitekturen är på plats, men vi är ett litet lag och har inte haft tid att bygga det ännu!
WD: Fungerar Scarlet med ramar som Bootstrap eller Foundation?
TG: Ja. Vi har dock gjort vårt bästa för att förbli agnostiska när det gäller kärnanvändargränssnittet. Du kommer inte hitta några Bootstrap eller Foundation specifika funktioner precis utanför flaggan, men vi har några planer på dessa områden.
WD: Scarlet är en stationär app, trots att den är byggd med HTML, CSS och JavaScript. Varför valde du den rutten över alternativet webapp?
Detta är ett överlägset arbetsflöde för responsiv design och skulle helt enkelt inte vara möjligt utan hybridanvändningen
TG: Vi startade som en webapp, men insåg snabbt att det var fler fördelar med att gå hybrid. Den viktigaste anledningen var UX. Med kontroll över miljölagret kan vi verkligen optimera upplevelsen. Konsumentbläsare är utformade för tillfällig användning. Scarlet är en app som vi vill att folk ska använda hela dagen och det är idealiskt om vi tar bort allt det som kommer med konsumentens webbläsarupplevelse.
Förutom att vi får fullständig integration med filsystemet kan vi även erbjuda funktioner som parallella webbläsare, vilket gör att du kan öppna flera sidor och flera brytpunkter samtidigt och Scarlet kommer att sprida DOM och stilen ändras direkt till alla visningar. Detta är ett överlägset arbetsflöde för responsiv design och skulle helt enkelt inte vara möjligt utan hybridanvändningen.
WD: Scarlet har en förhandsgranskning av fjärrkontrollen, är det beroende av appar (som Adobe's Edge Inspect)?
TG: Nej. Vi är inte stora fans av onödiga appar. Vi sänder dina faktiska filer på ditt nätverk så att du kan navigera vilken webbläsare som helst på vilken enhet som helst till fjärrförhandsgranskningsadressen och där den är.
WD: Är Scarlet riktade mot enskilda designers eller lag? Har det ett arbetsflöde som underlättar samarbete?
TG: Vi har närmar oss Scarlet som en plattform. Kärnan i applikationen handlar om att tillhandahålla ett solidt arbetsflöde. Arkitekturen är dock utformad för att kunna utökas, så lag kan böja det för att möta deras individuella behov. Vi har några ganska spännande funktioner på färdplanen som utövar denna sträckbarhet.
WD: Du startar på Mac först, följt av Windows. Är det ett affärsbeslut eller ett tekniskt beslut?
TG: Det är ett uppstartsbeslut. Vi har begränsade resurser och vi vet att den största delen av publiken finns på Mac, så det är det vi bygger först.
Windows kommer dock inte vara långt bakom. Eftersom 95% av applikationen är byggd med JS är konverteringsplattformar ganska smärtfria.
WD: Hur länge måste vi vänta med att prova för oss själva?
TG: Vi strävar efter att ha det i allas händer i slutet av året!
WD: Tack för att du tog dig tid att svara på våra frågor Tom.