The Expected (and Unexpected) Benefits of Building with Block Kit
Slacks nya Block Kit har resulterat i en mer effektiv upplevelse för både användare av Guru-appen och Guru-teamet. Nu är det enklare än någonsin att använda Guru-appen för Slack. Ta reda på hur vårt team på Guru tog tillvara på Slacks Block Kit-erbjudande.
Detta inlägg skrevs för Slack Platform Blog. Läs den ursprungliga posten här.
Gurus Slack-integration började i de tidiga dagarna av bottar, där upplevelsen främst var textbaserad och har växt i funktionalitet när Slack har introducerat fler funktioner — som interaktiva meddelanden och appåtgärder. Vi såg omedelbart fördelarna med Block Kit, en möjlighet att bygga djupare, rikare upplevelser som våra användare har kommit att förvänta sig, med mer bekanta UI/UX-mönster och interaktivt innehåll. Vad vi inte förväntade oss var dock hur Block Kit skulle förändra det sätt på vilket våra utvecklings- och designteam samarbetar.
Bygga en bättre onboarding-upplevelse
Vi tillämpade först Block Kit för att förnya hjälpmenyn i vår app. Tidigare, när en användare började, skulle hjälpmenyn hälsa dem med en vägg av informationsinnehåll. Denna text var inte bara svår att skanna, utan krävde också att användaren skrev kommandon för att åstadkomma något. App-onboarding är avgörande för våra användare, och vi använde Block Kit för att helt omforma upplevelsen — på två nyckelsätt:
Genom att använda avdelare stiliserade vi den väggen av informationsinnehåll genom att gruppera liknande innehåll — vilket gör det mer lättförståeligt och enklare att läsa.
Inline-knappar och overflow-menyer möjliggjorde en interaktiv, handlingsorienterad onboarding-upplevelse. Nu behöver användarna inte skriva kommandon; de kan helt enkelt välja en knapp och snabbt vidta åtgärder.
Hjälpmenyn var bara en plats där Block Kit lyfter Guru-appens upplevelse. Inline-knappar i aktivitetsflödesgränssnittet för samman åtgärdspunkten närmare motsvarande information. Overflow-menyer döljer nu åtgärder som används mindre ofta, och hjälper användaren att fokusera på viktig information. Vi har bara skrapat på ytan — det finns fortfarande otaliga sätt som Block Kit kan göra appar mer interaktiva.
Tala samma språk
På Guru, att bygga konsekventa upplevelser över alla gränssnitt (webbapplikation, webbläsartillägg och Slack-app) kan vara utmanande. Medan design och utveckling arbetar outtröttligt för att säkerställa sömlösa upplevelser för våra användare, är det en samarbetsprocess med mycket fram och tillbaka. Tidigare började vårt designteam (som vanligtvis inte är vana vid att bygga på Slack) med en tom duk och stötte ofrånkomligen på tekniska begränsningar — särskilt när deras designer övergick till utveckling, vilket krävde många iterationer innan de landade på en slutlig design.
Oavsett ineffektiv, är denna process en som de flesta utvecklare känner igen. Medan vi förväntade oss att skapa rikare, mer interaktiva upplevelser med Block Kit, kunde vi inte förutse hur mycket Block Kit Builder skulle förändra partnerskapet mellan design och utveckling. Block Kit Builder är en visuell prototypsandlåda som gör att du kan välja, stapla och anpassa vilket tillgängligt block som helst.
För Guru, förenar Block Kit Builder design- och ingenjörsgapet — så att våra designers enkelt kan prototypa sin ideala användarupplevelse, samtidigt som de också producerar den exakta JSON som behövs för att utvecklingen ska implementera deras vision. Vårt designteam behöver inte längre börja från en blank yta, och fråga: Var kan jag sätta den här knappen? eller Vilken text ska jag använda? Nu är det lika enkelt som att skapa layouten, dela URL:en och sedan iterera fram och tillbaka.
Block Kit Builder fungerar även som ett verktyg för utvecklare att felsöka problematiskt JSON. Om ett appmeddelande inte renderas korrekt, klistrar vi helt enkelt in koden i byggaren och kan omedelbart identifiera problemet.
Effektivitet i sitt finaste
Kombinationen av Block Kit och Block Kit Builder har resulterat i en mer effektiv upplevelse för både appanvändare och Guru-teamet. Block Kit ger oss inte bara en ny ram för att bygga unik app UI, utan ger oss också flexibilitet och kontroll över ordningen och layouten av information. Nu är det enklare än någonsin att använda Guru-appen; plus den uppdaterade hjälpmenyn får användarna att komma igång snabbt.
Nyfiken? Kolla in Gurus nyligen uppdaterade Block Kit-enabled app i Slack App Directory på slack.com/apps.
Detta inlägg skrevs för Slack Platform Blog. Läs den ursprungliga posten här.
Gurus Slack-integration började i de tidiga dagarna av bottar, där upplevelsen främst var textbaserad och har växt i funktionalitet när Slack har introducerat fler funktioner — som interaktiva meddelanden och appåtgärder. Vi såg omedelbart fördelarna med Block Kit, en möjlighet att bygga djupare, rikare upplevelser som våra användare har kommit att förvänta sig, med mer bekanta UI/UX-mönster och interaktivt innehåll. Vad vi inte förväntade oss var dock hur Block Kit skulle förändra det sätt på vilket våra utvecklings- och designteam samarbetar.
Bygga en bättre onboarding-upplevelse
Vi tillämpade först Block Kit för att förnya hjälpmenyn i vår app. Tidigare, när en användare började, skulle hjälpmenyn hälsa dem med en vägg av informationsinnehåll. Denna text var inte bara svår att skanna, utan krävde också att användaren skrev kommandon för att åstadkomma något. App-onboarding är avgörande för våra användare, och vi använde Block Kit för att helt omforma upplevelsen — på två nyckelsätt:
Genom att använda avdelare stiliserade vi den väggen av informationsinnehåll genom att gruppera liknande innehåll — vilket gör det mer lättförståeligt och enklare att läsa.
Inline-knappar och overflow-menyer möjliggjorde en interaktiv, handlingsorienterad onboarding-upplevelse. Nu behöver användarna inte skriva kommandon; de kan helt enkelt välja en knapp och snabbt vidta åtgärder.
Hjälpmenyn var bara en plats där Block Kit lyfter Guru-appens upplevelse. Inline-knappar i aktivitetsflödesgränssnittet för samman åtgärdspunkten närmare motsvarande information. Overflow-menyer döljer nu åtgärder som används mindre ofta, och hjälper användaren att fokusera på viktig information. Vi har bara skrapat på ytan — det finns fortfarande otaliga sätt som Block Kit kan göra appar mer interaktiva.
Tala samma språk
På Guru, att bygga konsekventa upplevelser över alla gränssnitt (webbapplikation, webbläsartillägg och Slack-app) kan vara utmanande. Medan design och utveckling arbetar outtröttligt för att säkerställa sömlösa upplevelser för våra användare, är det en samarbetsprocess med mycket fram och tillbaka. Tidigare började vårt designteam (som vanligtvis inte är vana vid att bygga på Slack) med en tom duk och stötte ofrånkomligen på tekniska begränsningar — särskilt när deras designer övergick till utveckling, vilket krävde många iterationer innan de landade på en slutlig design.
Oavsett ineffektiv, är denna process en som de flesta utvecklare känner igen. Medan vi förväntade oss att skapa rikare, mer interaktiva upplevelser med Block Kit, kunde vi inte förutse hur mycket Block Kit Builder skulle förändra partnerskapet mellan design och utveckling. Block Kit Builder är en visuell prototypsandlåda som gör att du kan välja, stapla och anpassa vilket tillgängligt block som helst.
För Guru, förenar Block Kit Builder design- och ingenjörsgapet — så att våra designers enkelt kan prototypa sin ideala användarupplevelse, samtidigt som de också producerar den exakta JSON som behövs för att utvecklingen ska implementera deras vision. Vårt designteam behöver inte längre börja från en blank yta, och fråga: Var kan jag sätta den här knappen? eller Vilken text ska jag använda? Nu är det lika enkelt som att skapa layouten, dela URL:en och sedan iterera fram och tillbaka.
Block Kit Builder fungerar även som ett verktyg för utvecklare att felsöka problematiskt JSON. Om ett appmeddelande inte renderas korrekt, klistrar vi helt enkelt in koden i byggaren och kan omedelbart identifiera problemet.
Effektivitet i sitt finaste
Kombinationen av Block Kit och Block Kit Builder har resulterat i en mer effektiv upplevelse för både appanvändare och Guru-teamet. Block Kit ger oss inte bara en ny ram för att bygga unik app UI, utan ger oss också flexibilitet och kontroll över ordningen och layouten av information. Nu är det enklare än någonsin att använda Guru-appen; plus den uppdaterade hjälpmenyn får användarna att komma igång snabbt.
Nyfiken? Kolla in Gurus nyligen uppdaterade Block Kit-enabled app i Slack App Directory på slack.com/apps.
Upplev kraften i Guru-plattformen förstahands - ta vår interaktiva produktturné
