🧩 Podobieństwa Framera i Webflow
Framer i Webflow to dwa, topowe narzędzia no-code do tworzenia stron internetowych, które szturmem podbiły rynek. Co je łączy?
Cóż, prosta rzecz: tworzenie stron internetowych bez konieczności znajomości języków programowania. Oba narzędzia umożliwiają tworzenie responsywnych stron, które doskonale prezentują się na wszystkich urządzeniach, oferują też bogaty zestaw funkcji (np. kreatory drag-and-drop, animacje, interakcje i zewnętrzne integracje). Pozwalają też na prace nad projektami jako zespół.
Oba cieszą się też wsparciem prężnie rozwijających się społeczności i bogatymi zasobami edukacyjnymi. 📚
👉 Jeśli chcesz uczyć się Webflow, a nie wiesz, gdzie zacząć, koniecznie zobacz nasze bezpłatne lekcje Webflow dla designerów z Maciejem Machem. Zapisać się możesz pod tym linkiem – to nic nie kosztuje!
🕵️ Co je zatem różni?
1️⃣ Łatwość obsługi
→ Webflow posiada bardziej intuicyjny interfejs i jest łatwiejszy do nauki (chociaż nieco bardziej skomplikowany w obsłudze). Gdy już przebrniesz przez podstawowe zagadnienia, reszta będzie jak bułeczka z masłem!
→ Framer ma bardziej złożony interfejs, który przypomina nieco Photoshopa. Wymaga od użytkownika więcej wkładu własnego, aby w pełni ogarnąć, jak się po nim poruszać. Jego learning curve wypada nieco gorzej.
Niektóre z ułatwień (i utrudnień), które wpływają na łatwość obsługi 👇
👉 Webflow automatycznie umieszcza elementy w kontenerach – w przypadku Framera musisz zrobić to ręcznie.
👉 Webflow wykorzystuje klasy elementów, dzięki czemu możesz grupować podobne elementy i stosować do nich te same style. Framer nie posiada tej funkcji. Do każdego elementu dostosowujesz styl osobno.
👉 W Webflow możesz łatwo tworzyć różne stany elementów, np. stan hover. W przypadku Framera musisz stworzyć oddzielne komponenty dla każdego stanu. Aby uzyskać przycisk, który zmieni kolor po najechaniu myszką, musisz zaprojektować dwa przyciski: jeden w domyślnym kolorze i drugi w kolorze odzwierciedlającym stan hover.
👉 Webflow oferuje większą elastyczność w tworzeniu animacji niż Framer.
2️⃣ Abonamenty
→ Webflow posiada bardziej złożoną strukturę planów cenowych. Sam builder jest darmowy, jednak bardziej zaawansowane plany są podzielone na Workspace i Site. Jeśli chcesz postawić stronę internetową, wybierasz plan Site General, a jeśli sklep online – Site E-commerce. Wszystkich planów jest aż 7. Jeśli chcesz współpracować ze swoim zespołem, wybierasz Workspace [jest i opcja In-house i Freelance] – i opłacasz każdego członka osobno.
→ Framer posiada również osobne plany cenowe dla Site i Teams. Podobnie jak w przypadku Webflow, z Framera można korzystać za darmo (niektóre z jego funkcji pozostają płatne).
A jak wygląda porównanie dwóch, najdroższych planów tych narzędzi w kategorii Site? 💰
→ Plan Pro Framera kosztuje 30 USD miesięcznie. Jego odpowiednik, czyli plan Business Webflowa, wynosi 39 USD miesięcznie [płatność roczna].
→ Jeśli chodzi o hosting, to Framer pozwala na 100 GB przepustowości i 200 tysięcy odwiedzających miesięcznie. Webflow daje 400 GB i 300 tysięcy odwiedzających.
→ i Framer, i Webflow dają limit 10 tysięcy elementów w ramach CMSa.
→ Oba programy pozwalają publikować zmiany szybko, łatwo i bez limitu.
3️⃣ Funkcje CMS (Content Management System)
→ Webflow oferuje bardziej rozbudowany system CMS. W obu narzędziach spotkasz standardowe opcje, czyli dla swojego wpisu blogowego swobodnie ustawisz tytuł, slug (czyli adres url) i treść, a także daty, pliki, toggle, czy obrazy.
→ CMS Framera działa bardzo podobnie! Posiada tylko nieco mniej funkcji.
4️⃣ Dostępne narzędzia
→ Webflow oferuje dwa główne narzędzia – Webflow Designer i Webflow Editor. Designer służy do tworzenia wyglądu i struktury strony, a Editor umożliwia edycję treści bezpośrednio na stronie. To idealne rozwiązanie dla klientów, którzy chcą móc edytować zawartość strony, bez wchodzenia w techniczne detale.
→ Framer posiada jedno narzędzie i do tworzenia stron internetowych, i do zarządzania treścią CMS. Klienci mogą zatem łatwiej „popsuć” pierwotną wizję projektantów.
5️⃣ Dostępność szablonów
→ Oba narzędzia pozwalają budować strony na szablonach.
→ W przypadku Webflow, większość templatek jest płatna.
→ Framer posiada więcej bezpłatnych szablonów i pozwala je bardziej dostosowywać pod swoją koncepcję.
6️⃣ SEO
→ Webflow + SEO = ❤️. Webflow przygotuje za Ciebie sitemapę witryny i dość łatwo pozwoli dodać customowy kod, przekierowania, metadane. Umożliwia też optymalizację – a to coś, co roboty indeksujące lubią najbardziej.
→ Framer posiada bardzo podobne funkcje, a przy tym posiada zintegrowaną analitykę, która działa na podstawie GA4.
⚠️ Co ważne: ani Framer, ani Webflow, nie da Ci super wyników SEO, jeśli nie masz dalszego planu na wdrażaną stronę, czyli np. publikacji bloga.
7️⃣ Nauka i społeczność
→ Webflow posiada bardziej rozbudowaną społeczność niż Framer, no i mnóstwo bezpłatnych materiałów do nauki w ramach Webflow University.
→ Framer też posiada swoją społeczność, swoje forum, lekcje i tutoriale, jest ich jednak mniej. Z biegiem czasu na pewno będą rozbudowywać swoją strefę edukacyjną.
🤓
8️⃣ Wsparcie AI
→ Webflow nie korzysta z rozwiązań sztucznej inteligencji, choć ma to w swoich planach na przyszłość.
→ Framer posiada własne narzędzie AI, które, po wpisaniu odpowiedniego prompta, wygeneruje dla Ciebie stronę. I naprawdę fajnie działa!
Co myśli Maciej Mach?
Maciej Mach to prowadzący kurs Webflow Designer – wielokrotny gość na naszych webinarach i w podcaście. Współprowadzący Uniforma studio. Projektant z 18-letnim doświadczeniem w tworzeniu produktów cyfrowych (chociaż sam programistą nie jest).
🎙️ „Nauka, generalnie, no-code i przede wszystkim, właśnie, Webflow, myślę, że to jest nie tylko umiejętność tego, żeby postawić własną stronę internetową, ale myślę też, że jest to sposób na zasypanie tej przepaści między projektantami, a programistami, ponieważ my faktycznie używamy w tej chwili dwóch różnych języków na takie same rzeczy i jeżeli będziemy się uczyć właśnie takiego Webflow, no to jesteśmy w stanie bardzo zmniejszyć ten dystans, ponieważ w końcu zaczniemy gadać tym samym językiem, co nam pozwoli po prostu osiągać dużo lepsze efekty w zespołach, w których mamy po prostu różne kompetencje.” – Maciej Mach w 55. odcinku podcastu Design Practice: Co daje designer(k)om obsługa Webflow?
🍿 O narzędziach no-code (w perspektywie UX) wypowiada się też Michał Mazur w 50. odcinku podcastu. Wpadnij posłuchać! 👂🏻
Oczywiście, to porównanie naszym okiem. Podsumowując – oba narzędzia są bardzo fajne, jednak do pracy z klientem polecamy Webflow, a do eksperymentowania – Framera.
A Ty co wybierasz? Jesteś #teamframer czy #teamwebflow? ( ͡° ͜ʖ ͡°)
