Wypuszczanie Produktów i Startupów na Rynek: Projektowanie strony
Jak skutecznie uruchomić internetowy projekt
11 godz. 20 min · Biznes i Automatyzacje
Grzegorz RógIdea ArchitectCzego się nauczysz
- Co dla mnie działa przy premierach produktów cyfrowych
- Jak przygotować sam produkt jak SaaS do premiery
- Które kanały są wartościowe, a które można odpuścić
- Co robić w trakcie samej premiery i gdzie ogłosić produkt
- Jak zdobyć pierwszych użytkowników i leady wokół premiery
- Jakich narzędzi i automatyzacji użyć w tym procesie
- Na co zwrócić uwagę planując marketing
- I wiele więcej!
Słowo wstępu od Grzegorza
Zarówno w Polsce jak i za granicą uruchomiłem już dziesiątki projektów... Były to zarówno narzędzia, SaaSy jak i infoprodukty. Praktycznie wszystkie uruchomione przeze mnie projekty lądowały na głównej stronie Product Hunt i już od pierwszego dnia - zarabiały. Wszyscy biznesowi mentorzy powtarzali, że "powinienem skupić się na jednej rzeczy". Tymczasem w mojej ocenie, to, co robię daje mi wolność i co równie ważne - pozwala ciągle się uczyć. Moje projekty zarabiają kilka-kilkanaście tysięcy dolarów miesięcznie, co czasem wystarcza, żeby utrzymać niewielki zespół, niekiedy nawet to jest niepotrzebne, wystarczy sporo automatyzacji i produkt, który jest niemal w 100% marżowy. Początkowy etap projektów daje mi ogromną frajdę - lubię sam odkrywać i kreować produkt, który następnie testuję i wypuszczam na rynek. Na przestrzeni lat, w tym zakresie wyrobiłem sobie utarte ścieżki, z których ciągle korzystam, ale też pozwalam sobie na wiele eksperymentów po to, by w ciągle zmieniającym się ekosystemie internetowych produktów - uczyć się, co działa. Późniejszy etap projektów raczej mnie nudzi - zatrudnianie, tworzenie dużego zespołu oraz zarządzanie nim, to nie jest coś co mnie ekscytuje. Zauważyłem też, że wraz ze skalowaniem zespołu często maleją także zyski z projektów, na których mi zależy. Zwykle więc staram się, aby moje projekty... pozostały małe (ale bardzo dochodowe), co daje mi wolność: finansową i czysty kalendarz. Jeśli któryś z nich rozwija się za szybko, myślę o sprzedaży i exicie, ale tym nie będziemy zajmować się w tym Kursie. Sprzedałem w Internecie produkty dla ponad 300 tysięcy osób. Od infoproduktów jak kursy i ebooki, przez narzędzia i SaaSy. Każdy z tych projektów ma swoją specyfikę i konkretne techniki, które wykorzystuję, by go rozwijać. Każdy nauczył mnie czegoś nowego i w każdym z nich popełniłem jakieś błędy. W tym Kursie, chciałbym powiedzieć Ci wszystko, co wiem o uruchamianiu produktów, które są już "w miarę gotowe", czyli są blisko Product Market Fit, bądź czekają na premierę jako infoprodukt czy narzędzie. Chcę przekazać Ci mój sposób na to, jak przygotowuję produkt do premiery, jak myślę o marketingu, automatyzacjach, treściach czy stronie WWW i w końcu jak układam to w taki sposób, aby po prostu działało! Jakiś czas temu udzieliłem wywiadu na temat moich projektów Courtlandowi, twórcy ruchu Indie Hackers, który jest bliski temu, co robię. Jeśli masz chwilę, posłuchaj go tutaj. Jednak moja filozofia ma istotne odchylenie: uważam, że nie każdy projekt powinien być tworzony jednoosobowo. Prawie zawsze stawiam na małe zespoły - kilku co-founderów i kilka osób do pomocy lub na freelance, bo wierzę, że w ten sposób można robić większe rzeczy, dające więcej wartości, z potencjałem na pozyskanie rozsądnego finansowania czy exit.
Czego możesz spodziewać się po tym Kursie?
W trakcie Kursu dowiesz się o trzech kluczowych fazach związanych z międzynarodową premierą projektu: Przygotowaniu do premiery, Premierze oraz działaniach po premierze. Sama premiera jest dość symboliczna i nie ma aż tak dużego znaczenia - to, dlaczego jest ważna, to pozwala wybrać datę, w której to, co sobie założyliśmy w produkcie powinno się zmaterializować. W trakcie Kursu pokażę Ci wiele narzędzi oraz wytłumaczę moje podejście i frameworki, które pozwalają mi co jakiś czas wypuszczać z sukcesami produkty na rynek. Pomówimy o automatyzacjach, które towarzyszą mi na każdym kroku a także doborze stacku w kontekście marketingu. Dowiesz się, co działa dla mnie najlepiej w tym konkretnym momencie. Czy warto stawiać wyłącznie na działania organiczne, czy wspierać się płatną reklamą i innymi kanałami. Gdzie warto się pokazać i co warto robić po to, aby sama premiera dała nam dodatkowy boost i pozwoliła zdobyć wartościowe leady. Mam nadzieję, że zebrane w ten sposób wskazówki, pozwolą Ci uniknąć moich błędów, zyskać mnóstwo czasu a także oszczędzić pieniądze, które inaczej mógłbyś przepalić na niepotrzebne działania.
Jak dobrze wykorzystać ten Kurs?
Idealnie, jeśli masz już produkt lub jesteś blisko MVP, które chcesz wypuścić na rynek. W takim przypadku, możesz razem ze mną podążać po kolejnych obszarach, które poruszam w tym Kursie i tworzyć swój własny plan na premierę. Jeśli jednak dopiero tworzysz czy planujesz uruchomienie swojego produktu - ten Kurs też będzie przydatny tylko pod warunkiem, że nie oczekujesz od niego pomocy we wczesnej fazie - wymyślania i samej kreacji. Jeśli masz jasną wizję tego, co stworzysz, świetnie! Ten Kurs powinien przybliżyć Cię do wyjścia z produktem na rynek na etapie, gdy będzie on już gotowy. Dobrze by było, gdybyś podążając za mną w kolejnych lekcjach, znalazł/a czas na odniesienie moich spostrzeżeń do Twojego projektu i praktyczną pracę nad przygotowaniami do premiery, nawet jeśli ta jest jeszcze odległa.
Odpowiemy sobie też na przykład na pytania:
- Jak stworzyć międzynarodową stronę WWW?
- Czy warto jest korzystać z LTD jak AppSumo?
- Jak ustalić pricing produktu?
- Jak zbudować wczesną publiczność i opinie klientów?
- W których kanałach warto budować rozpoznawalność?
- Jakie kanały akwizycji klientów wybieram?
- Jak zbudować dobry onboarding?
- Jak nie upaść po fazie wzrostu na premierze?
- I wiele więcej!
Dla kogo jest ten kurs?
Ten Kurs jest starannie przygotowany z myślą o:
- Founderach - twórcach internetowych projektów, takich jak narzędzia, SaaSy, Startupy, którzy budują swoje rozwiązania małym zespołem i chcą wycisnąć maksa z premiery swojego rozwiązania.
- Twórcach narzędzi - osobach technicznych, które budują rozwiązania dla innych, takie jak narzędzia, frameworki, UI Kit'y, micro SaaSy czy aplikacje webowe i mobilne, także w technologiach no-code.
- Zwinne zespoły w firmach - jeśli do któregoś z tworzonych produktów, chcą podejść bardzo "lean" i uruchomić go podobnie jak startup
- Twórcach treści - w mniejszym stopniu, ale z Kursu skorzystają też osoby, które tworzą swoje infoprodukty, kursy, ebooki i inne treści, które chcą uruchomić i promować międzynarodowo. Główne przykłady w Kursie są oparte o narzędzia i SaaSy, ale wiele z omawianych technik wykorzystuję też w infoproduktach
Cześć!
Przed nami całkiem przyjemna część, ponieważ zajmiemy się
stylistyką strony internetowej.
W poprzedniej lekcji wytłumaczyłem Ci krótko na co zwracam uwagę, jak tworzę
repozytorium treści do strony internetowej i w końcu jak dla każdej z poszczególnych
podstron, które zaprojektowałem w side mapie, tworzę wersję tekstową, a następnie
tworzę bardzo prosty prototyp, w którym sugeruję użycie pewnych komponentów.
Nie zmienia to faktu, że nie mamy jednak jeszcze pełnej stylistyki, ale mamy
wszystko to, co służy nam do stworzenia tej stylistyki.
Ponieważ już wcześniej skupiliśmy się na zrobieniu brandu, więc mamy nowe logo,
mamy jakiś brand book z wykorzystaniem odpowiedniej typografii, mamy również
język, jakim nasi klienci się posługują, mamy persony i to wszystko.
Mamy też testimoniale, a przynajmniej kilka od klientów.
Mam nadzieję.
I to wszystko sprawia, że możemy teraz przejść do skutecznego stworzenia i
zaprojektowania strony, a to co mamy przed sobą jest całkiem przyjemne, ponieważ
polega po pierwsze na tym, żeby przejrzeć sobie rozmaite inspiracje, więc to, jak
robimy research pod kątem stylistyki naszej strony.
No to patrzymy najpierw i wstawiamy do zakładek strony, które
szczególnie nam się podobają.
Nie muszą to być strony z jakimiś produktami finansowymi, mogą to być
zupełnie inne witryny, ale takie, które przemawiają do nas po prostu
swoją stylistyką, swoim układem.
No i w moim przypadku wybrałem takie strony, które faktycznie są bardzo czyste,
kojarzą się z finansami lub wprost ich dotyczą, jak Ramp network czy na przykład
strony Stripe, na których też którymi też się częściowo inspirowaliśmy.
Tutaj są naprawdę fajne produkty, które posiadają dosyć spójną,
czystą, jasną stylistykę.
No i wylistowałem sobie te strony oraz inne, które w pewien sposób mnie
inspirowały, które mają na przykład jakieś fajne efekty, jak tutaj Shopify Ventures,
które de facto miały nam posłużyć do tego, żeby stać się inspiracją pod EasyToolsy.
Tutaj na przykład są całkiem fajne ilustracje, aczkolwiek też trzeba mieć po
prostu na uwadze to, że każde ilustracje z czasem się starzeją, często
szybciej niż później.
No i chciałem, żeby akurat strona Easy, bo tutaj robiłem do niej research, była
stroną, która jest bardzo czysta i która nie ma takich elementów, które są bardzo
mocno stylistycznie inspirowane i dzięki temu będą też adekwatne, odpowiednie
dla większej liczby osób.
Nie będą w pewien sposób, no, nie będą.
Nikogo też na przykład denerwowały ilustracje, których ktoś nie lubi
czy jakieś bardzo żywe kolory.
Starałem się to wszystko przemyśleć tak, żeby faktycznie było to
bardziej stonowane i delikatne.
To, co Ci pokazuję, to szereg właśnie tego typu inspiracji i to do mnie przemawia.
To jest bardzo taki typowy wygląd, ale jednocześnie coś, co idealnie
odpowiada temu, co chcę zrobić.
Więc szereg takich inspiracji sobie po prostu zapisuję.
W przypadku każdego mojego projektu robię taki mały research i po prostu te strony
dodaję do również Figma lub do Sigmy.
I wygląda to tak, że tworzę sobie taki moodboard z inspiracjami.
Tutaj są wypisane jakby informacje w skrócie o tym, jakich
komponentów, jakich elementów chcemy użyć, czym się sugerujemy, co
jest dla nas inspiracją.
Jak widzisz, są to screenowane właśnie fragmenty tych stron, które są do
siebie, no można powiedzieć dość podobne.
Przynajmniej łatwo jest z nich wywnioskować, o jaki styl nam chodzi.
No i w końcu jest tutaj właśnie sekcja taka, która była pierwszą wczesną
inspiracją do Easy i która wynika z tych z tych inspiracji, które są tutaj.
No i na ich podstawie zaczęliśmy projektować strony.
Jeśli chodzi o same układy stron, no to po pierwsze skupiliśmy się na stronie
głównej i nad tym, jak ją zaprojektować.
Przypominam, że mam tutaj w sekcji web site dokładnie to, jak chciałbym, żeby
wyglądała strona główna, jeśli chodzi o treści oraz poszczególne komponenty.
No i teraz Matt i Gabi, z którymi współpracowaliśmy pomogli to wszystko
przełożyć na konkretne, Konkretny, konkretną stronę, konkretny komponent,
konkretny wygląd naszej strony głównej.
Tą stronę główną w zasadzie iterowaliśmy kilkadziesiąt razy po to, żeby
dojść do takiej, do takiej formy.
Ponieważ zastanawialiśmy się jak najlepiej przedstawić te nasze narzędzia.
No i tutaj zrobiliśmy taki komponent, który zmienia się i pokazuje
każde kolejne narzędzie z toolsów.
Zmienia się też tło tej strony, ale ogólnie jest ona bardzo prosta, bardzo
minimalistyczna i dokładnie w takim klimacie, jakim chcieliśmy.
Zdecydowaliśmy się też na użycie, na użycie statystyk, na użycie
cytatów klientów.
Mamy tutaj zdjęcia osób, które też całkiem dobrze działają.
Mamy jak widzisz bardzo podobną stylistykę do tej, którą tam pokazywałem wcześniej na
tych przykładach, którymi się inspirowaliśmy.
Więc w ten sposób projektujemy najpierw stronę główną, jakiś wzór do
Fostera, no i każdą kolejną stronę naszej witryny, którą już projektuje się dużo
prościej, ponieważ już jak już mamy jakieś gotowe komponenty, to te poszczególne
podstrony projektuje się dużo szybciej.
No i nasza strona oczywiście jest dość złożona, więc mamy tutaj sporo i nawet
mamy też iteracje jedne z wielu iteracji tej strony głównej i tego co
znajduje się Above the fold.
Chyba nad tym spędziliśmy z Mattem zdecydowanie najwięcej czasu jeśli chodzi
o stronę easy, ale też na wszystkich stronach staram się, żeby to above
default było naprawdę dobrze zrobione.
Na przykład mogę pokazać Ci właśnie i wrócić też do Alice, gdzie uważam, że
całkiem nieźle jest zrobione to Above the Fold, bo mieści w sobie wszystkie
najważniejsze informacje, czyli i demo produktu, i nagłówek, który zresztą cały
czas się zmienia, bo cały czas z nim eksperymentuję i kilka
takich bulletpointów.
To co zawiera nasza aplikacja, możliwość jej pobrania i jeszcze jakiś social
proof, czyli tutaj akurat Product Hunta.
A tutaj opinie i informacja o tym, że zaufało nam dwa i pół tysiąca
użytkowników, Więc ściśnięte above the fold, czyli na tym głównym ekranie, który
użytkownik widzi po wejściu na stronie jest mnóstwo informacji, które są
bardzo istotne w przypadku ESI.
Jest tych informacji mniej, ale też.
Jest ten ticket z poszczególnymi toolami i nie chcieliśmy tej
strony mocno przeciążyć.
Natomiast nadal, jak widzisz, jest tutaj ta sama konwencja,
czyli mamy social proof.
Czyli to, że zaufało nam tyle i tyle osób.
Pewnie tutaj dodamy jeszcze jakiegoś BGA, jednego z Product Hunta czy z
innej platformy, na przykład z G2.
Następnie mamy mamy prosty slogan, który powinien po prostu odpowiadać temu,
co nasi, czego nasi użytkownicy chcą.
Powinniśmy wypisać sobie tutaj dwie, trzy nasze główne persony i zastanowić się,
jak im powinniśmy opowiedzieć o produkcie.
W skrócie to, co znajduje się w default, czyli nad tym na pierwszym
ekranie naszej strony.
To powinno być dokładnie to, dzięki czemu użytkownik powinien już dokładnie wiedzieć
z czym ma do czynienia, czyli co robi nasza aplikacja, co robi nasz produkt, co
robi nasze narzędzie i dlaczego będzie mu przydatne.
Więc bardzo ważne jest stworzenie właśnie tego nagłówka w odpowiedni sposób, jak
również musimy cały czas mierzyć się z tym, że mamy tą listę słów kluczowych, z
których też chcemy korzystać, bo wiemy, że użytkownicy ich wyszukują, więc one są
tutaj upchane całe w kopii tej strony, a następnie mamy opis,
czyli to, co znajduje się pod nagłówkiem, który też jest bardzo ważny.
Jeśli nagłówek mówi jaką wartość dostajesz, to opis mówi o tym, dlaczego ją
dostajesz, więc może mówić trochę o funkcjach, może mówić dokładniej,
trochę o tym, czym nasze narzędzie jest.
W zależności oczywiście od tego, jak dużo informacji potrzebujemy tutaj przedstawić.
Jeden przycisk akcji.
Dla mnie dosyć ważna rzecz, żeby nie mieć tutaj wyboru pomiędzy
kilka różnych przycisków.
Mam to przetestowane i taki przycisk, który ma akcję Drive for free albo Get
Now, albo coś takiego jest naprawdę bardzo dobry.
A pod spodem jeszcze dwie albo trzy zaadresowane największe obiekcje
przed kliknięciem tego przycisku.
To, że one tutaj są, to nie jest przypadkowe.
Jeśli ktoś chce kupić ten przycisk, jeszcze się nad tym zastanawia, to musimy
pomyśleć o tym, jakie pytania się pojawiają w jego głowie przed
kliknięciem tego przycisku.
Co mogłoby sprawić, że zastanawia się nad spróbowaniem np.
Czy będzie mógł anulować subskrypcję?
To akurat nie jest adekwatne, ale generalnie np.
Czy musi?
Czy wymaga to jakiejś wiedzy technicznej albo nie wiem czy setup tego będzie
skomplikowany i wtedy możemy tutaj dać five minute, setup required czy coś
takiego, że pokazać, że jest to szybkie, więc zastanowić się nad kilkoma
najważniejszymi rzeczami, które mogą wystąpić jako obiekcje przed
kliknięciem tego przycisku.
Co znajduje się dalej niżej na tej stronie?
Staram się dawać dużo social proof na tej stronie i odpowiadać przede
wszystkim na obiekcje klientów.
To jest jeden sposób na robienie takiej strony, gdzie odpowiadamy na obiekcje,
dajemy różne statystyki, dajemy różne właśnie opisy.
Pokazujemy, co zyskasz dzięki tej stronie, tej naszej aplikacji, temu narzędziu.
No i pokazujemy, jakie funkcje się w nim znajdują.
No i znowu staramy się rozbić obiekcje.
Tutaj akurat porównujemy Strike'a jeszcze z Ice Cartem i tak dalej.
Natomiast drugi, drugi sposób tworzenia takiej strony to na przykład
w przypadku infoproduktu.
Tutaj na zautomatyzowanym Zautomatyzowanych.
Mam dobry przykład na taką stronę.
Czasem tworzę tego typu witryny, które po prostu opowiadają jakąś historię.
Najpierw coś obiecują, znowu mamy konkretny nagłówek, mamy konkretny opis,
ale i konkretną, jedną akcję do wykonania oraz social proof, więc to się
praktycznie nigdy u mnie nie zmienia.
Natomiast później mamy opowiedzianą historię i ta historia jest podparta
argumentami, jest podparta opiniami klientów, jest podparta wideo.
Więc generalnie jest to powiedzmy historia.
Więc możemy pomyśleć sobie o tym, żeby landing page stworzyć jako pewną historię
i możemy wtedy napisać ją zgodnie z jakimś konkretnym frameworkiem, na przykład
frameworkiem Aida, który jest całkiem niezły do tego, żeby po prostu pisać
treści marketingowe, czyli musimy złapać attention, później
interest, później desire i action, czyli po kolei przejść przez pewne
standardowe rzeczy, które zawsze mają użytkownicy i oczekują ich od produktów.
Więc taki framework Aida i takie rozpisanie historii jest naprawdę niezłe.
Jeśli chodzi o info produkty, ale może też posłużyć nam do reklamowania
jakichś nie tylko info produktów, ale też jakichś narzędzi czy czy innych rzeczy,
które są na przykład edukacyjne.
No i tutaj dalej na stronie mamy też jeszcze szereg, szereg funkcji, szereg
opinii, rzeczy, które po prostu starają się przekonać, rozwinąć to, co mamy
najważniejsze w tych naszych narzędziach.
Zawsze na dole tej strony umieszczam sekcję FAQ, gdzie tutaj umieszczam
najbardziej popularne pytania.
To też ważna sekcja.
No i na samym końcu.
Zwykle robię tak, że dodaję jeszcze jedno CTA, czyli obok tego
mojego głównego headera.
Jeśli już ktoś zszedł tak nisko, że jeszcze dalej ma te obiekcje.
Czyli nie udało mi się rozbić obiekcji, nie udało mi się.
To, że w trakcie przeglądania tej strony ktoś nie kliknął tego guzika drive for
free, który zresztą tutaj się pojawia w prawym górnym rogu przez cały czas, to na
samym dole zobacz, że mam taką dodatkową akcję Onboarding call i przy produktach,
które albo są high ticket, albo mają wysoką cenę, albo po prostu mamy na to
czas jako founderzy, żeby to zrobić.
Na samym dole.
Nie robiłbym tego na górze, ale na samym dole, Kiedy ktoś ma wciąż te obiekcje.
Warto umieścić taki link do zaplanowania z nami rozmowy.
Ja to robię przez Zenka, ale ktoś się umawia i po prostu wskakujemy z nim na
kola i staramy się rozwiązać jakieś wątpliwości, które dotyczą
korzystania z naszych narzędzi.
Więc to jest oczywiście opcjonalne, ale działa naprawdę całkiem nieźle.
No i będzie też działać dla tych produktów high ticket, tak jak wspomniałem, czyli
tych produktów, które de facto są odpowiednio drogie, żebyśmy mogli wspierać
klientów w taki sposób i poświęcać im czas na każdorazowo, na przykład na wdrożenie.
No i na samym początku i tak robimy jako founderzy rzeczy, które się nie skalują.
Czyli to jest jedna z tych rzeczy i powinniśmy to robić.
Ale mówię o tym etapie później, kiedy już mamy klientów i np.
Rozważamy, czy zatrudnić dział sprzedaży.
Jeśli mamy produkty high ticket, to może ten dział sprzedaży będzie obsługiwał
nam te calle onboarding owe.
No i poniżej na razie szkic, ale jednak obszernego fostera, w którym chcę
zamieścić jak najwięcej rzeczy.
Pokazywałem Ci mniej więcej jak to wygląda już w poprzedniej lekcji, jeśli chodzi o
samą stylistykę, czyli sam research ze screenowanie sobie komponentów,
wrzucenie tego w firmę i później próbę zaprojektowania stron zgodnie
z naszym style guidem i B.
Tymi inspiracjami, które znaleźliśmy to tak naprawdę wszystko.
Akurat w przypadku EasyTools jest tutaj mnóstwo stron do zaprojektowania.
W przypadku Alice miałem tylko 3 strony, a tutaj mamy tego naprawdę dużo, więc
lecimy sobie po prostu po kolei.
Po wszystkich typach stron, które rozpisałem w sidemapie i
pokazałem Ci wcześniej.
No i odpowiednio je projektujemy, więc projektujemy case studies, projektujemy
ten kontent, te gajdy, projektujemy jakieś free downloady, wszystkie inne
rzeczy, które też były w Akademii.
Projektujemy sobie nawet właśnie te strony legal, nawet jakąś prostą site
mapę, stronkę z featureami.
To wszystko znalazło się w mapie i to wszystko musi zostać na
gotowo zaprojektowane. W ten sposób w Sigmie.
Skąd bierzemy te wszystkie komponenty?
Skąd bierzemy te wszystkie elementy, które tak naprawdę tutaj lądują finalnie
w tym designie na stronie? Bierzemy je.
Możemy je oczywiście zaprojektować sami, ale lepiej jest, bo szybciej po prostu
skorzystać z gotowego frameworka.
I my akurat używamy frameworka, który nazywa się rerum i to jest framework,
który zarówno jest dostępny dla firmy, jaki jest dostępny dla Webflow.
Czasem korzystamy też z naszego frameworka Systemflow, ale akurat tutaj w przypadku
EasyTools strona jest tak rozbudowana, że w system flow nie mamy
aż tylu komponentów.
Oni mają 1400 komponentów, naprawdę dużo.
Mają mnóstwo gotowych rzeczy, które już są w bibliotece Webflow i w bibliotece Figmy,
więc generalnie jest to dobry framework do wyboru dla nas, dlatego, że korzystamy z
Webflow, o czym powiem Ci w następnej lekcji i to uzasadnię.
Natomiast może to nie być framework idealny dla Ciebie.
Może chcesz skorzystać z Kramera, albo chcesz skorzystać z jakiegoś innego
rozwiązania i wtedy być może sprawdzisz sobie Untitled UI czy jakieś inne
frameworki podobne do Reluma.
Ja jednak mogę polecić Reluma, nawet mimo tego, że jest to konkurencyjne
rozwiązanie do naszego.
Jest naprawdę świetne i zawiera mnóstwo całą bibliotekę, figme, Sigma całą
bibliotekę komponentów, które są gotowe i które są, można powiedzieć, nieustylowane,
ponieważ możemy bardzo łatwo dołożyć do nich nasz brandbook, nasze
kolory, nasze logo i tak dalej.
I po prostu z tych bibliotek w gotowym, z gotowego pliku firmy poskładać
sobie te wszystkie elementy.
W samej firmie te biblioteki są tutaj już w tym pliku, z którego zaczęliśmy
korzystać, więc możesz zobaczyć, że jest tutaj mnóstwo gotowych już komponentów i
layoutów, które możemy wykorzystać, po prostu przeciągnąć i
upuścić na naszą stronę.
I na razie korzystamy właśnie z tych komponentów, które tutaj są w reroomie po
to, żeby właśnie zbliżyć się do tego, co mieliśmy w tym mock upie, a
tych mock upów nie robiłem.
Oczywiście tych wczesnych projektów z tym, bo szkoda czasu, ale później miazga, by
jak już projektowali całość, to właśnie korzystali z tych gotowców i wybierali
tylko te, które najbardziej pasują albo do tego, co ja zrobiłem, albo do
tego, co oni sobie zaplanowali.
No i po prostu kopiowali, umieszczali je na stronie, a następnie dostosowywali
trochę pod te style, które sobie określiliśmy w moodboard ie.
No i w zasadzie to cała filozofia.
Dzięki temu, że jest to tak zrobione, to te same komponenty będą dla nas dostępne w
następnym kroku, czyli w Webflow do tego, żeby łatwo umieścić je
jako responsywne komponenty w naszej stronie internetowej i poskładać w miarę
szybko z tych wszystkich rzeczy, nawet tak złożoną i skomplikowaną stronę
internetową, którą mamy.
Znów chciałem Ci pokazać ten proces na trudnym przykładzie, ponieważ każdy
prostszy będzie teraz dla Ciebie jeszcze łatwiejszy do zrobienia, ale finalnie
prawdopodobnie będziesz rozbudowywać swoją stronę po to, aby dotrzeć do takiego
etapu, zwłaszcza jak będzie się rozwijać.
Więc widzisz teraz, że mamy możliwość skorzystania tutaj z wielu gotowców.
Natomiast nadal, jak widzisz te gotowce, one są takie bardzo surowe, one są
nieostylowane, nie są z kolorami.
No i właśnie o to chodzi, bo po prostu dzięki temu, że możemy nałożyć na to nasz
ten style guide, będziemy mogli uzyskać z nich unikalny wygląd.
To wszystko na teraz.
I zapraszam Cię do przejrzenia tego, jak ta strona wygląda i jest
zaprojektowana w Webflow. Do usłyszenia!