Przez ostatnie kilka tygodni intensywnie pracowaliśmy nad zaprojektowaniem od nowa wyglądu i funkcjonalności panelu opcji w naszym edytorze. Efektem tych działań jest zupełnie nowa odsłona tej części aplikacji, zarówno wizualna, jak i funkcjonalna. Poznaj edytor landing page z nowymi możliwościami!

Wizja

Naszym celem było maksymalne uproszczenie wyglądu oraz ujednolicenie działań, które to Wy, drodzy użytkownicy podejmujecie, tworząc landing page’e w edytorze Landingi. Musieliśmy zatem stworzyć coś intuicyjnego, łatwego w użyciu, a zarazem spełniającego oczekiwania wszystkich użytkowników. Ogólne cechy nowej odsłony to:

1. Opcje ogólne każdego elementu

Połączyliśmy opcje geometryczne (wysokość, szerokość, położenie) z informacjami dotyczącymi elementów. Dodatkowo powstała możliwość zmiany nazwy elementu, co pozwoli na sprawniejsze zarządzanie nimi. Dla bardziej zaawansowanych użytkowników przewidzieliśmy opcję nadawania identyfikatorów i klas oraz definiowania widoczności elementów na poszczególnych widokach.edytor landing page

2. Tło

W elementach takich jak sekcje lub boxy podstawową wartością jest tło. Zastosowaliśmy tutaj bardzo prosty mechanizm, gdzie najpierw wybiera się kolor tła, a później można dodatkowo zdefiniować obrazek lub gradient, czyli płynne przejście jednego koloru w drugi. Oczywiście tło można włączać i wyłączać za pomocą jednego kliknięcia w prosty przełącznik.

edytor landing page

3. Obramowanie

Zasada ustawiania obramowania elementu jest bardzo prosta. Na początku należy zaznaczyć krawędź, którą chcemy edytować (można również wszystkie na raz), a następnie wybieramy odpowiednio kolor, grubość oraz styl linii ramki. Schemat krawędzi odwzorowuje nam aktualny stan każdej z nich – kolorem błękitnym oznaczone są krawędzie aktywne. Dodatkowo każdą z nich można w łatwy sposób wyłączyć – najpierw zaznaczyć, a następnie kliknąć przycisk “Wyczyść”.

edytor landing page

4. Zaokrąglone rogi

Tutaj sprawa jest również bardzo prosta. Najpierw wybieramy, któremu z narożników chcemy nadać zaokrąglenie (można wszystkim jednocześnie), a następnie definiujemy odpowiednią wartość. Podobnie jak w powyższych grupach opcji, można usunąć zaokrąglenie z każdego z narożników lub wyłączyć je globalnie.

edytor landing page

5. Cień

Do takich elementów jak box, obrazek lub tekst niejednokrotnie chcemy dodać cień. Wystarczy wybrać kolor cienia, a następnie zdefiniować rozrzut oraz przesunięcie w poziomie (X) oraz w pionie (Y). Dwie ostatnie wartości możemy zrównoważyć i nadać im tą samą wartość.

edytor landing page

6. Tekst

Dla elementu tekstowego mamy dostępne dwie opcje w panelu po prawej stronie. Są to: interlinia, czyli odstępy pomiędzy wierszami oraz tracking, czyli odstępy pomiędzy znakami danego tekstu.

edytor landing page

Zotań wirtuozem landing page!

Zapisz się na webinar »