Дизайнер

1. Заголовок Motion-дизайнер: Lottie-анімація аналізу обличчя для landing (web, векторна)2. Що робимо Потрібна одна векторна анімація для hero-секції landing-сторінки веб-продукту (AI-аналіз обличчя, playful-формат). Сюжет: стилізоване wireframe-обличчя (лінійне, напівпрозоре, намальоване художником — не фото). На нього по черзі «сідають» landmark-точки (очі, ніс, лінія щелепи, брови), між ними будується легка сітка. У фіналі з обличчя м'яко «вилітають» 2–3 невеликі score-картки (напр. Curiosity 88 / 100). Поведінка: build-in при завантаженні (сітка будується, картки з'являються, ~3–4 с) → далі тихий безшовний цикл (~8–12 с): сітка ледь «дихає», картки м'яко пульсують. Без різких рухів.3. Стиль Естетика: editorial, clinical, grey — спокійне світле «студійне повітря», тонкі лінії, м'яке світло зсередини. Референс тону — QOVES face-analysis (преміальний «медично-аналітичний звіт» × журнальний розворот). Важливо — тон: це playful vibe-аналіз, а НЕ медичне сканування й НЕ розпізнавання особи. Жодних IDENTIFIED-рамок, прицілів-перехресть, червоного, «безпекового» HUD, кібер-неону. Точки й виноски мають відчуватись цікаво й легко, а не як біометричний нагляд. Палітра й типографіка — суворо за витягом наприкінці цього документа (дотримання палітри — умова приймання). Референси, які додаю: QOVES-естетика + 2–3 приклади Lottie у сіро-clinical / wireframe-стилі + скріншот hero, куди анімація стане (поруч є скляні картки — анімація має з ними жити, а не сперечатись).4. Технічні вимоги Формат: Lottie JSON, прозорий фон. Розмір файлу: ≤ 150 КБ (ідеал ~80–100 КБ). 30 fps. Без растрових зображень усередині — усе вектор (жодних вбудованих PNG/JPG). Мінімум масок і великих градієнтів; без ефектів, які Lottie не рендерить нативно (складні blur, деякі merge-paths). Обов'язково тестувати експорт саме у web-плеєрі (lottie-web / LottieFiles preview), а не лише в After Effects. Мобільні: коректно програється й читається на реальних iOS Safari та Android Chrome; на вузькій колонці обличчя/сітка не обрізаються, картки не вилазять за межі; плавно на бюджетному Android. Артборд, що чисто масштабується у діапазоні ~360–700px ширини. Постачається з reduced-motion кадром — статичний фінальний стан (побудована сітка + картки) для prefers-reduced-motion.5. Deliverables + права Виконавець здає: Lottie JSON для landing. Reduced-motion статичний кадр (SVG або PNG). Редагований вихідник — файл проєкту After Effects (.aep) з усіма шарами й підписаними групами. (Опційно / бонус) «тиха» light-версія для login-сторінки з тих самих шарів — якщо вкладаєтесь у бюджет; інакше виноситься в наступний етап. Права: повна передача виключних майнових прав + необмежене комерційне використання. Виконавець підтверджує, що всі елементи оригінальні або ліцензовані під комерцію. Шрифти в картках — безкоштовні Google Fonts (Hanken Grotesk, JetBrains Mono), жодних платних-шрифтових пасток.6. Процес Стилфрейм у першу добу — один статичний стоп-кадр майбутньої анімації на затвердження стилю. Я підтверджую того ж дня. Після мого «ок» — анімація. 2 раунди правок включені в ціну. Оплата по етапах через Safe-угоду: частина після затвердження стилфрейму, решта — після приймання фінальних файлів. Важливий швидкий старт: стилфрейм у першу добу, тож відгукуйтесь лише якщо реально вільні зараз.7. Бюджет і термін Бюджет: $150 за повний обсяг із вихідниками й правами (фіксовано). Термін: 4 дні від старту.8. Що надіслати у відгуку 1–2 роботи саме в Lottie / motion (не лише статичні ілюстрації). Короткий коментар: як ви бачите цей стиль під наш референс. Підтвердження, що можете стартувати одразу й дати стилфрейм у першу добу. Відгуки без прикладів Lottie й без коментаря по стилю не розглядаю.Витяг-палітра (віддати обраному виконавцю) Це все, що потрібно художнику по кольору/типографіці. Повний CSS/репозиторій не передаю. Фон: нейтральний світлий #f2f5f7. Лінії сітки, контур обличчя, текст: сірі «чорнильні» тони —#1f2730 (основний), #56606c (вторинний), #8a93a0 (світліший). Єдиний акцент — лише на вузлах-точках landmark: сіро-сланцевий #505c65(глибший варіант #3b4651). Більше НІДЕ акцент не використовувати. Заборонено: будь-які інші кольори, насичені градієнти, веселки, неон, червоне,важкі тіні. Тіні — лише м'які, низької прозорості, з холодним відтінком. Score-картки (trait-reveal): напівпрозорі «скляні» плитки (frosted, легкий blur, тонкий світлий кант); велика цифра — тонка вага 300, елегантна, не жирна; підпис-мітка — маленький моно-шрифт, КАПСОМ, розріджений трекінг. Шрифти: Hanken Grotesk — назви трейтів, підписи (вага 300–500). JetBrains Mono — маленькі мітки, індекси, цифрові підписи (напр. / 100). Тон одним рядком: спокійне майже біле студійне повітря, освітлене зсередини;тонкі лінії; один сіро-сланцевий акцент торкається тільки вузлів сітки.

Dzień dobry, koledzy. W związku z problemami u projektanta, trzeba było rozpocząć jeszcze wczoraj dopracowywanie projektu stron. Załączam makietę w Figma stron, które są gotowe - Figma Gotowe teraz: Strona główna, Katalog, Karta produktu. Co trzeba dorysować: Panel użytkownika, Koszyk, Realizacja zamówienia, Jakość i kontrola, Certyfikaty, Blog oraz wewnętrzna strona bloga. Proszę tych, którzy naprawdę zapoznali się: makiety, które są już gotowe, Tz oraz prototypy — napisać kontrolną odpowiedź z Tz. Tz - Kliknij Prototypy - Kliknij

Konieczne jest profesjonalne zaprojektowanie sklepu internetowego na platformie Хорошоп, aby był nowoczesny, wygodny i wizualnie atrakcyjny. Co jest wymagane: Zapewnienie jednolitego stylu firmowego na stronie głównej. Ustawienie pięknych banerów, kategorii i bloków z produktami. Poprawa wizualnego wyglądu kart produktów i kategorii. Stworzenie wygodnej nawigacji i struktury strony głównej. Ustawienie atrakcyjnego wyświetlania promocji, nowości, popularnych produktów i marek. Optymalizacja wyświetlania strony na urządzeniach mobilnych. W razie potrzeby zaproponowanie ulepszeń w zakresie UX/UI. Wykorzystanie możliwości platformy Хорошоп bez pogarszania prędkości ładowania strony. Atutem będzie: Doświadczenie w projektowaniu sklepów na platformie Хорошоп. Posiadanie portfolio z zrealizowanymi projektami. Znajomość nowoczesnych zasad UX/UI i e-commerce. Znajomość wymagań SEO przy projektowaniu strony. Proszę o przesłanie: linków do sklepów, które zaprojektowałeś na Хорошоп; krótkiego opisu wykonanych prac; kosztu i terminu realizacji projektu.

Potrzebny jest front-endowiec/projektant stron internetowych do wizualnej aktualizacji strony. Funkcjonalności zmieniać nie trzeba — tylko wygląd (HTML/CSS, obrazy). Co jest teraz: Funkcjonująca strona gry (panel sterowania prywatnym serwerem Mu Online) w PHP, silnik autorski, bez frameworków. Szablony — zwykłe pliki HTML z placeholderami typu $TITLE$, $USER_USER$ itp., które silnik sam podstawia danymi przy ładowaniu. Style — zwykły CSS, skrypty — jQuery, bez bundlerów (Webpack/Vite) i preprocesorów (SASS/LESS). Strona składa się z 2 funkcjonalnych sekcji: część gościnna (dla niezalogowanych — opis serwera, wiadomości, top) oraz część wewnętrzna (panel gracza — statystyki postaci, gildie, miasto, sklep itp.). Przełączanie między nimi na poziomie treści, a nie osobnych stron. Co trzeba zrobić: Część gościną — wizualnie zaprojektować od podstaw według referencji (styl mutts.lt, jest gotowa koncepcja AI, ale jest zbyt jaskrawa, trzeba dostosować do ogólnej palety strony). Część wewnętrzną — zaktualizować wizualnie istniejące strony (panel gracza, miasto, gildie itp.) według referencji, zachowując całą obecną strukturę danych i funkcjonalność. Ważne: Placeholdery silnika ($...$) nie mogą być ruszane — tylko markup i style wokół nich. Cała obecna logika (obliczenia, formularze, zapytania AJAX) pozostaje bez zmian — przenoszona do nowego layoutu bez modyfikacji. Dostęp do plików strony i konta testowego udostępnię po rozpoczęciu pracy. Dołączę do zamówienia: referencję projektu (site.png), zrzuty ekranu obecnego wyglądu strony.

1. Ogólne informacje o projekcie Zleceniodawca: rodzinny park rozrywki w Niemczech (pełna nazwa i domena zostaną ujawnione wykonawcy po rozpoczęciu projektu) Typ projektu: pełny redesign i przebudowa strony od podstaw Aktualna strona: WordPress/Elementor, przestarzała, wymaga całkowitej wymiany Grupa docelowa: rodziny z dziećmi w wieku od 2 do 12 lat, region Niemiec z kilkoma dużymi miastami w pobliżu (15 do 20 minut samochodem) Język strony: główny niemiecki (DE), dodatkowo angielski (EN), osobna wersja językowa CMS: według uznania dewelopera, WordPress z niestandardowym motywem, Webflow lub headless CMS. Nie używać Elementora. Domena: istniejąca, przenoszona bez zmiany Termin oddania: do uzgodnienia z zleceniodawcą 2. Cele i kluczowe KPI Nowa strona powinna spełniać trzy strategiczne funkcje: Przekazywać atmosferę parku jako immersywnej przygody, nie lista usług, a zanurzenie w tematycznym świecie. Maksymalizować konwersję: odwiedzający stronę powinien dokonać rezerwacji w mniej niż 3 kliknięcia z dowolnej strony. Zapewnić doskonałe mobilne UX, ponad 60% ruchu oczekiwane z urządzeń mobilnych. KPI #1: czas do pierwszego kliknięcia "Zarezerwuj" nie więcej niż 10 sekund od momentu załadowania strony głównej KPI #2: Page Speed Score (Google PageSpeed Insights) nie mniej niż 85 na urządzeniach mobilnych, nie mniej niż 90 na desktopie KPI #3: wskaźnik odrzuceń (Bounce Rate) poniżej 45% KPI #4: poprawne wyświetlanie we wszystkich nowoczesnych przeglądarkach (Chrome, Firefox, Safari, Edge) oraz na iOS/Android 3. Zakres prac 3.1 Strony i sekcje Minimalny zestaw stron: Strona główna: sekcja Hero, zapowiedź pokazu na żywo w weekendy, top 5 atrakcji, opinie Google, blok CTA Katalog atrakcji z filtrem według wieku (0 do 3 / 3 do 6 / 6 do 12 lat), karty z zdjęciami i filmami Pakiety urodzinowe, opis plus konfigurator Aktualne promocje i sezonowe wydarzenia, każde z własną wizualną kartą Ceny, tabela plus widget rezerwacji online (integracja z zewnętrznym systemem rezerwacji) Restauracja, menu i atmosfera Galeria zdjęć plus wbudowany feed Instagram O parku, zasady, FAQ (bez powielania zasad) Kontakt, mapa Google Maps, formularz kontaktowy, godziny otwarcia, klikalny telefon i email Odbicie wszystkich stron w języku angielskim 3.2 Co należy usunąć z aktualnej strony Wszystkie teksty o ograniczeniach COVID 19 (2021 do 2022), w tym stopka FAQ z pytaniami o koszty tworzenia stron internetowych (treści zewnętrzne) Przestarzały copyright, zastąpić aktualnym Niedziałające przyciski popup Elementor Przestarzałe powiadomienia o otwarciu po ograniczeniach Powielanie zasad parku w sekcji FAQ 4. Wymagania funkcjonalne P1 = krytyczne dla uruchomienia, P2 = pożądane w v1.0, P3 = możliwe poprawki później 4.1 Sekcja Hero (strona główna) P1, Fullscreen Video Hero: autoplay wideo bez dźwięku (muted, loop), 100vw na 100vh. Po kliknięciu włączenie dźwięku. Na wideo krótki slogan i przycisk CTA. P1, warstwa tekstowa nad wideo: nagłówek H1, podtytuł plus przyciski "Zarezerwuj" i "Dowiedz się więcej". Czcionka czytelna na każdym tle. P1, Sticky Navigation: pasek nawigacyjny przyczepia się na górze podczas przewijania, tło zmienia się z przezroczystego na ciemne podczas przewijania. P1, Sticky CTA Button: przycisk "Zarezerwuj" zawsze widoczny, na desktopie w nagłówku, na urządzeniach mobilnych stały pasek na dole ekranu. P2, animacje przewijania: elementy pojawiają się z animacją CSS (fade in plus slide up) podczas przewijania. Biblioteka Intersection Observer lub AOS.js. Bez ciężkich bibliotek 3D. 4.2 Atrakcje P1, karty atrakcji: zdjęcie/wideo, nazwa, krótki opis, ikona ograniczenia wiekowego, przycisk "Więcej informacji" P1, filtr według wieku: filtr klienta bez przeładowania strony, realizacja klasy CSS plus komponent vanilla JS lub Vue/React P1, szczegółowa strona atrakcji: własny URL, duże zdjęcie/wideo, pełny opis, ograniczenia wzrostu/wieku, przycisk rezerwacji P2, krótki film wideo: 15 do 30 sekundowy film dla każdej atrakcji, autoplay przy najechaniu na desktopie lub tap na urządzeniach mobilnych 4.3 System rezerwacji P1, integracja z zewnętrznym systemem rezerwacji: widget wbudowany inline (iframe lub JS embed) na stronach cen i urodzin, bez otwierania w nowej karcie P1, wieloetapowy proces rezerwacji: kreator krok po kroku, typ wizyty, data/godzina, liczba gości, potwierdzenie, obowiązkowy pasek postępu P1, wyjaśnienie slotów czasowych: blok informacyjny obok wyboru czasu P2, na żywo dostępność slotów: zapytanie API do systemu rezerwacji, wyświetlanie zajętych/wolnych slotów w czasie rzeczywistym 4.4 Konfigurator urodzinowy P1, wieloetapowy konfigurator: wiek jubilata, liczba dzieci, wybór pakietu, dodatkowe opcje, wybór daty, formularz zapytania lub bezpośrednia rezerwacja P1, dynamiczne obliczanie ceny: aktualizowane w czasie rzeczywistym przy zmianie parametrów, bez przeładowania P2, podsumowanie końcowe: zbiorcza karta wyboru na ostatnim kroku z przyciskami "Zapytaj" i "Zarezerwuj bezpośrednio" 4.5 Zaufanie i społeczna weryfikacja P1, widget Google Reviews: minimum 5 recenzji, średnia ocena, gwiazdki, umiejscowienie na stronie głównej nad blokiem CTA rezerwacji P1, feed Instagram: wbudowany feed ostatnich 9 do 12 postów przez oficjalne API lub widget, link do konta P2, licznik odwiedzających: animowany licznik 4.6 Dodatkowe bloki funkcjonalne P1, status "teraz otwarte/zamknięte": automatyczne oznaczenie na podstawie godzin otwarcia P1, klikalne kontakty: telefon i email jako aktywne linki, obowiązkowo w nagłówku i na stronie kontaktowej P2, interaktywna mapa parku: SVG lub mapa obrazkowa z klikalnymi strefami atrakcji P2, tracker obciążenia: wizualny wskaźnik oczekiwanego obciążenia parku P2, odliczanie do wydarzenia: widget odliczający do najbliższego sezonowego wydarzenia P3, osobna sekcja wieczornych wydarzeń: strona lub sekcja z własnym stylem wizualnym i przyciskiem rezerwacji 5. Wymagania niefunkcjonalne 5.1 Wydajność LCP nie więcej niż 2,5 sekundy na urządzeniach mobilnych (3G fast) CLS mniej niż 0,1 FID/INP mniej niż 100 ms Google PageSpeed Score nie mniej niż 85 mobile, nie mniej niż 90 desktop Obrazy: format WebP plus fallback JPEG, lazy loading, srcset Wideo: streaming przez CDN lub osadzenie YouTube/Vimeo, nie przechowywać ciężkich MP4 na hostingu 5.2 SEO Schema.org: LocalBusiness plus OpeningHoursSpecification plus Event Meta tagi: unikalne title (nie więcej niż 60 znaków) i description (nie więcej niż 155 znaków) na każdej stronie Hreflang dla przełącznika językowego Canonical URL na każdej stronie Sitemap.xml automatycznie generowany Skonfigurowany robots.txt 5.3 Dostępność WCAG 2.1, poziom AA jako minimalny standard Atrybuty alt obowiązkowe dla wszystkich obrazów Kontrast tekst/tło nie mniej niż 4,5 do 1 Pełna nawigacja z klawiatury Atrybuty ARIA na wszystkich interaktywnych elementach 5.4 Bezpieczeństwo HTTPS obowiązkowy, przekierowanie z HTTP DSGVO/GDPR: baner cookie (Zarządzanie zgodą), aktualna polityka prywatności Ochrona CSRF, honeypot lub reCAPTCHA v3 na wszystkich formularzach Wszystkie zależności aktualnych wersji, bez znanych luk w zabezpieczeniach 5.5 CMS i edytowalność Teksty, ceny, godziny otwarcia, zdjęcia edytowalne przez CMS bez angażowania dewelopera Tworzenie/archiwizowanie promocji i wydarzeń przez interfejs CMS Automatyczna aktualizacja feedu Instagram przez API Film instruktażowy (10 do 15 minut) dotyczący pracy z CMS, obowiązkowy deliverable 6. System designu 6.1 Paleta kolorów: głęboka zieleń jako kolor podstawowy, średnia leśna zieleń jako kolor wtórny, czerwony akcent dla CTA, jasna zieleń dla tła kart, beżowy dla akcentów teksturowych, ciemny dla tekstu głównego, biały 6.2 Typografia: wyrazista czcionka display dla nagłówków (w duchu przygody), czytelna neutralna czcionka sans serif dla tekstu głównego, minimalny rozmiar 16px body, 14px caption, wysokość linii 1,5 do 1,7 6.3 Obrazy i media: tylko prawdziwe zdjęcia, zdjęcia stockowe nie używać, format WebP, minimum 1920px dla hero, 800px dla kart, wideo hero nie dłuższe niż 30 do 60 sekund w wersji loop, wszystkie obrazy z prawem do publikacji 6.4 Animacje: efekty hover płynne (scale 1.03 na kartach), animacje przewijania fade in plus translateY, tylko transform i opacity dla przyspieszenia GPU 7. Oczekiwane wyniki Projekty w Figma: desktop plus mobilny widok wszystkich stron (desktop 1440px, mobilny 375px) Responsywna struktura: punkty przerwania 375 / 768 / 1024 / 1440px, podejście mobile first Gotowa strona na domenie stagingowej do odbioru, po zatwierdzeniu wdrożenie na domenę produkcyjną Konfiguracja CMS: wszystkie edytowalne obszary skonfigurowane, testowo wypełnione Film instruktażowy (10 do 15 minut) dotyczący zarządzania treścią Podstawowa konfiguracja SEO: meta tagi, Schema, Sitemap, podłączenie Google Search Console Instalacja Google Analytics 4 plus Google Tag Manager, konfiguracja zdarzeń (click CTA, form submit, page_view) Testowanie między przeglądarkami i urządzeniami, raport PageSpeed Insights przed oddaniem Przekazanie kodu źródłowego (repozytorium Git) zleceniodawcy po finalnej płatności 8. Kryteria akceptacji Wszystkie wymagania P1 zrealizowane i przetestowane PageSpeed Score nie mniej niż 85 mobile, potwierdzone zrzutem ekranu Poprawne wyświetlanie na iPhone (Safari), Android (Chrome), iPad, MacBook, Windows (Chrome, Edge, Firefox) Formularz rezerwacji pomyślnie wysyła zapytanie i wysyła potwierdzenie Google Reviews ładują się poprawnie Feed Instagram aktualizuje się automatycznie Wszystkie linki działają, brak błędów 404 Baner cookie zgodny z DSGVO, GDPR Treść w CMS edytowalna bez angażowania dewelopera