Hansavedas — Homepage design proposals
Hansavedas — Self Enquiry Life Fellowship
New homepage · Design directions

Three directions for the new Hansavedas homepage

Each proposal keeps the identity and the content of the current site and modernizes the layout in a different way. Open each one, scroll, hover, try the menu on your phone, and tell us which you prefer, or which parts you would like to combine.

How it will be built →
Mockup 02

Editorial & photographic

A calmer, photography-led layout with a split hero and generous typography.

  • Split hero
  • Photography
  • Editorial
Open mockup 2
Mockup 03

Direction three

Same identity and content, with a third approach to the layout.

  • Tag one
  • Tag two
  • Tag three
Open mockup 3

How to review the proposals

Desktop and phone

Open each mockup on a computer and on your phone. All three are responsive, and the menu becomes a full-screen hamburger menu on small screens.

Scroll and hover

Sections animate as you scroll, and cards react when you hover over them. Move slowly, the details are part of the proposal.

Images and text are placeholders

These are visual proposals. Photos, copy and links will be finalized in the WordPress build after you choose a direction.

Behind the scenes

How each proposal is built

The site is built in WordPress with Elementor Pro, so your team can keep editing text, photos and links. A small amount of custom code adds the motion and layout details you see in the proposals. Here is what each proposal uses.

Mockup 01

Bold & interactive

Cinematic hero, expanding path panels, bento cards and a lot of small animations. The most interactive of the proposals.

4effects that are 100% native Elementor: no custom code
3effects that only need a few lines of CSS
6effects that use a small piece of JavaScript
Small JavaScript

Motion that reacts to you

One short script, loaded once at the end of the page. These effects need it because the browser has to watch scrolling or hovering.

  • Expanding path panelsHover a panel (Devotion, Yoga, Knowledge) and it opens while the others make room.
  • Hero title, line by lineThe headline rises line by line, as if revealed from behind a mask.
  • Hero photo parallaxThe background photo moves slightly slower than the page. Can be swapped for Elementor’s built-in scrolling effect.
  • Scroll reveal in cascadeCards, tiles and panels fade in one after another as they enter the screen.
  • Icons that draw themselvesThe line icons in the “Learn” tiles are traced as they appear.
  • Reading progress barA thin burgundy line at the top shows how far down the page you are.
CSS only

Style, not scripts

A few lines of CSS pasted once into the site settings. No JavaScript involved.

  • Header that shrinks on scrollUses Elementor’s sticky header; CSS shrinks the logo and adds a soft shadow.
  • Entrance of hero text and buttonsA gentle fade-up when the page loads. Elementor’s own entrance animation can do the same.
  • Hover effectsCards lift, buttons shine, arrows slide, links get an animated underline.
Native Elementor

Built with the standard widgets

No custom code at all. Your team edits them in the regular Elementor panel.

  • Number counters“490+ recordings” and “7 years” count up using Elementor’s Counter widget.
  • Menu, dropdowns and hamburgerElementor’s Nav Menu, fed by the regular WordPress menu editor. A fully custom hamburger animation is optional.
  • Latest articlesElementor’s Loop Grid shows the newest posts automatically, with each post’s own photo.
  • Newsletter sign-upElementor’s Form widget, connected to your email service.

Performance and safety

Light by design

  • About 4 KB of JavaScript (under 2 KB compressed), with no libraries and no jQuery dependency
  • Animations only move and fade elements, which browsers handle smoothly
  • Parallax is turned off on phones
  • Nothing is loaded from third-party animation services

Considerate of visitors

  • Visitors who set “reduce motion” on their device see a still page
  • Effects are switched off inside the Elementor editor, so editing stays comfortable
  • The layout is fully responsive; the menu becomes a full-screen hamburger menu on phones
  • Scroll animations only add motion; the content itself is always in the page
Back to the proposals
© 2026 Self Enquiry Life Fellowship. 501 (c)(3) Nonprofit EIN: 20-3478668. Design proposals · not the live site