← Svi hoteli
🏔️ Mountain · standalone

Etno Selo Moj Zavičaj

Draft Rudnik,Gornji Milanovac, RS ★ 4
↗ Preview
🏚️ Stari sajt — audit
4 frames Vision-om

Postojeći hotel sajt

https://mojzavicaj.rs
Era: 2018-2020; редизајн је неопходан — сајт показује класичне знакове раног WordPress СМС времена
Redesign direction: Еволуирати аутентичну естетику у 2025+ дизајн додајући subtle паралакс ефекте, fade-in revelations на скролу, модернију типографију (sans-serif за текст, serif само за наслове) и card-driven UI са јасним информационом архитектуром, уз напуштање Elementor ограничења.
✓ Strengths (zadržati)
  • Аутентична естетика која рефлектује руралну Србију и традицију
  • Јасна типографска хијерархија на хиро-у са великим, читљивим наслovima
  • Добра контраста између позадине (зелена поља) и текста (бели текст)
  • Наприродни, неФилтерирани одабир слика што даје веродостојност
  • Конкретни CTA дугмети (ПОЗОВИ, РЕЗЕРВИШИ) на видљивој позицији
✗ Weaknesses (zameniti)
  • Генеричка WordPress/Elementor архитектура — нема висококвалитетног motion design-а; статичан осећај
  • Картице са текстом су превише информације; недостаје визуелна хијерархија унутар картица
  • Фусс фотер са контактима занима исто места као главни садржај — неправилна хијерархија
  • Нема видљиве разлике између картица галеријске секције (однос слике и текста неоптималан)
  • Недостају scroll-driven анимације и микроинтеракције (fade-ins, паралакс); олдскул WordPress осећај
🏷️ Brand signals
Традиционална српска ношња и украси (вишњаста боја, везени мотиви)Рурална, аутентична палета (земљане боје + травната зелена + наранџаста)Отворено поље и природа као симбол миривања и аутентичностиОрнаментални логотип са традиционалним мотивимаПородични, интиман тон копија ('мој завичај', 'моја љубав')
🎨 Trenutna paleta
Typography: Масивна, традиционална serif/sans-serif микс; наслови у дебелом зеленом, текст у тамно-сивој; картице имају жуто-наранџасте акценте
Layout: Хиро са девојком у традиционалној ношњи (full-width слика) → текстуална секција → картица 'Кућа за две особе' са фотом → галеријска секција са три картице (blog-стајлинг) → контакт и друштвене мреже у футеру
Hero: Full-width позадина са зеленим пољима, девојка у традиционалној ношњи са кошаром, текст 'Мој завичај, моја љубав' белком; два CTA дугмета (ПОЗОВИ, РЕЗЕРВИШИ)
Image treatment: Фотографије су природне, светле, пастелне; употреба праву светлост и традиционалне мотиве; нема филтера, органична естетика која одише аутентичношћу
⚡ Detektovani efekti + DOM signali
Сајт је функционално статичан са генеричким WordPress motion language — нема никаквог scroll-driven ефекта или микроинтеракција што га чини старомодним и неангажујућим. Редизајн мора обавезно увести subtle паралакс на хиро-у, fade-in reveal анимације за картице при скролу, и smooth scroll поведење како би се подигла перцепција квалитета и модернитета; ово је критично за luxury/агритуризам позиционирање.
JS biblioteke (DOM-detected)
Swiper (carousels)Elementor (WordPress)WordPress
Scroll: Нативни скрол без smooth scroll-а, нема паралакс ефеката; све секције су статичне и без позицијских променa при скролу
Hover: Минимални — само дефолтни браузерски hover на линковима и CTA дугмићима; нема custom transitions или ripple ефеката на интерактивним елементима
Transitions: Базична CSS transition вероватно само на CTA дугмићима (scale, opacity) — никакава complexity
Scroll anims: Никакве scroll animations не постоје — nema fade-in на скролу, nema AOS (Animate On Scroll) библиотеке, nema sticky позиција осим 2 елемента (мени и можда footer)
Video/Motion: Нема видео елемената, нема Lottie анимација, нема embedded YouTube/Vimeo; чист static HTML-rendered content
Raw DOM signali ▾
@keyframes (30): hvr-ripple-out, pa-mask-tr, pa-mask-tl, pa-mask-tb, pa-mask-tt, spin, pa-btn-glitch, pa-text-glitch…
Anim CSS klase: sticky
Cards sa CSS transition: 18 · Sticky/fixed: 2 · SVG: 24 · Video: 0 (+ 0 iframe)
✗ native scroll · ✗ default cursor · ✗ no WebGL
What to keep
Аутентична палета земљаних боја, традиционални мотиви и руралну естетику которе чине бренд препознатљивим и емоционалним.
What to replace
WordPress/Elementor архитектуру у корист модерног stack-а (Webflow, Next.js или Statamic); статичне картице у динамичне са микроинтеракцијама и scroll анимацијама; генеричку структуру унутар галеријске секције у куратирану, visual-first презентацију.
🏆 Reference sajtovi — deep Vision

Inspiracija (1 OK / 1 ukupno)

www.belmond.com ↗
2 frames
Paleta
Typography: serif heritage display za naslove + sans-serif body, visok kontrast sa elegantnom retkom (luxury editorial)
Layout: hero sa fixed parallax pozadinom (turquoise plaža + beach loungers) → hero text 'PAGE NOT FOUND' centiran → HOME button na kraju hero zone → full-width sekcije sa alternativnim left/right layout-om (kontakt levo, newsletter desno u footer-u)
Hero: full viewport hero sa beach scenery kao fixed background (parallax efekat), tekstualni sloj sa 'PAGE NOT FOUND' u svetlosivoj boji (opacity ~70%), HOME button sa border stroke + hover effect, turquoise-to-sand color gradient ambijent
Image treatment: full-width hero background kao fixed parallax element (beach loungers na pesku), slike nisu kao standalone cards već kao sekundarni vizuelni elementi (logo u header-u)
Spacing: airy — veliki whitespace oko hero teksta, generozna padding u footer sekcijama, wide gutters između kolonskih group-a
Footer: dark gray background (#708B92 area), 4-kolona layout sa white text, levo 'CONTACT US' sekcija sa adresom i br. telefona, srednje kolone sa link grupama (Terms, Development, Careers, About, Modern slavery, Environmental, Digital accessibility), desno newsletter signup ('EXCLUSIVE NEWS, TRAVEL OFFERS' sa First name + Last name + email input), donji red sa copyright tekst + ABTA certifikacija logo
Section patterns
Hero sa fixed parallax background + centiran text overlay + CTA dugmeCookie consent modal (white bg, 3 button group: Cookie Settings | Reject All | Accept All)Footer sekcija sa 4 kolone: Contact Us (adresa + telefon + dugme), Links (Terms, Careers, About, itd.), Newsletter signup (2 input field-a + Sign Up dugme), Copyright + ABTA logo
Notable elements
  • Fixed parallax background hero sa statičnom tekstualnom overlay zonom
  • Centered 'PAGE NOT FOUND' tekst u sans-serif, light gray (error page tipografija)
  • Cookie consent modal sa tres ostra button hierarchy (Reject All i Accept All su emphasized, Cookie Settings je outline)
  • Footer sa 4-kolona grid + dark gray background + white text
  • HOME dugme sa rounded border + subtle hover state (likelyScale/opacity change)
★ What to steal
  • Fixed parallax hero background sa opacity text overlay — cineматski i luxe feel sa minimalnim tekstom (retko korišćen pattern u hotelima)
  • Cookie consent modal design sa tri jasna button states (primary, secondary, tertiary) — accessibility + conversion friendly layout
  • Footer sa 4-kolonski balanced grid + dark background contrast — premium editorial feel, dobra informacijska arhitektura bez clutter-a
⚡ Effects + animation
Sajt deluje miran ali bogat sa cinematic parallax hero-om i suptilnim fade-in reveal-ima na scroll — high-end editorial hospitality feel. Motion je conservativna ali efikasna, fokusirajući se na eye-guiding tokom scroll-a bez distrakcije (nema auto-play videa ili agresivnih animacija).
Scroll: parallax hero background (fixed image ostaje dok se tekst scroll-a preko — viewport locked parallax na turquoise plaži), fade-in animacije na sekcijama koje se pojavljuju tokom scroll-a (detektovano CSS @keyframes: fadein, fadeIn, fadeOut — verovatno AOS ili ScrollTrigger reveal-a)
Hover: HOME dugme: border color change + subtle scale/opacity transition (~0.3s), input fieldi u newsletter: focus state sa border highlight, social icons (Instagram, YouTube, LinkedIn, Facebook) sa hover color/opacity shift
Transitions: CSS transition na button hover (0.3-0.4s duration, likely ease-out), input focus states sa smooth color transition, sticky nav shrink transition na scroll (nav sticky element detektovan)
Scroll anims: fade-in animacije na scroll (CSS @keyframes fadein, fadeIn, fadeOut), parallax hero sa fixed background (koji ostaje locked dok se viewport scroll-a), sticky nav element koji ostaje vidljiv tokom scroll-a (6 sticky/fixed elemenata detektovano), slide-in levog/desnog sadržaja (slideInLeft, slideInRight @keyframes prisutne), scroll trigger reveal sekcija sa opacity+transform
Video/motion: nema video elemenata (<video> count: 0), nema YouTube/Vimeo iframe-ova — samo CSS keyframe animacije i scroll-triggered reveals
Raw DOM ▾
@keyframes: fadein, arrow-bounce, fadeIn, fadeOut, slideInLeft, slideInRight…
cards-transition: 9 · sticky: 6 · SVG: 19
✨ mirna elegancija sa cinematic aspiracijom — premium luxury hospitality brand usmeren na high-net-worth putnicima koji cene editorijalni dizajn
Vision audit: Ova analiza je input za Faza C template-generator. AI brief (theme + brand_colors + design_brief + homepage_sections) je generisan kombinacijom ovih signala + PHOBS metadata + scraped sadržaja.