Left and Right Fixed Navigation

(Russ) #1

I’m new to Hype. I’m trying it out right now for an upcoming project. I have a few questions.

First, can Hype be used to create full websites? Or is it primarily meant to be used to create animated sections of a website?

Second, I’m having a hard time figuring out how to implement the layout my client is requesting. He wants the company logo and a “hamburger” icon to be anchored in the top left corner of the website (here’s what I have put together so far: http://www.everblaze.com/evr2.html). That was easy enough to do. However, he also wants three additional icons to be anchored to the right side of the browser window. When the browser window width increases or decreases, the two sets of icons should remain “fixed” to the left and right sides of the page while the distance between the two sets varies. Is that possible with Hype?

Lastly, he wants a full height/width background image that will have interactive elements overlaid on top of it. Depending on which elements click, the background picture should change and new overlay elements will appear. The background picture should expand to fill the full height/width of the browser window. If that’s possible, how does Hype handle elements that are overlaid on top of a background image when the background image height/width are dynamic? Can an overlaid element “stick” to a certain place in the picture?

Thanks for any help you can provide!

(𝕄𝕚𝕔𝕙𝕒𝕖𝕝 𝔾𝕒𝕣𝕠𝕗𝕒𝕝𝕠) #2

It is possible to build a full site with Hype - if you’re building a “brochure” site. My major concern with Hype for a full site is how it handles SEO. By default, I’m thinking that a CMS (like WordPress or Drupal) would probably get better SEO results, while Hype would likely get better design results. WordPress and Drupal are often used for more newsy looking websites.

I’ve seen Hype sites that use separate projects for individual pages… which could be somewhat better for SEO, but is an awkward transition.

Hype has layers and elements can be pinned and be flexible. With Hype Pro, there are persistent symbols. I’m not entirely sure if Hype will meet all of your requirements, as I’m not entirely sure what they are, but it does seem that you’re probably in the right spot.

An element on top of a background can work like a button to change the background. I think the concern is not so much Hype, but the size of the project. Lots of large images can slow things down.

Getting an element to stick to a certain place in the picture might be tricky. Document scaling is an issue right now, as multiple elements don’t scale as easily as they would in Flash, but there are interesting thread about this on this forum…

(Russ) #3

Thanks for the info. I’ll check out the forum posts. Do you know of any tutorials on how to create a drop down menu? I would like the hamburger icon (three bars), when clicked, to open a drop down menu below it. And clicking on any of the drop down items would cause the background (and I suppose the scene) to change. I’m not sure how to make that work.

(Hans-Gerd Claßen) #4

basically you can setup this with hype.
It’ll be a lot of clicking … :wink: but with help of custombehaviours ans symbols there’s a way to go :smile:example

setup.hype.zip (72.1 KB)

this ist really just the basic setup …

#5

As for the SEO, we’ve just build a quite heavy website with Hype and used javascript page-tracking for Google Analytics. All went fine and smooth.
You can place the analytics code in your HTML head (inside Hype) , and do your tracking script. Then, you just call the script in each scene load.

(Mark Hunte) #6

@DavidA , Could you post this with an example and code as a tips & tricks i am sure others would find it usefull and that would be a good place to have it.

Thanks

#7

I moved a post to a new topic: Tracking Scene Loads in Google Analytics

(Russ) #8

Thanks a lot. I like the example.

(Russ) #9

I just posted these websites in another forum message. But I think it works here also. I’m curious if Hype can build websites like these:

http://silenza.it4
http://void.hi-res.net3
http://futurewatercity.com1
http://www.mugakofestival.com3
http://www.wynd.it2
http://pisma.may9.ru4

The audio feature in the first one is not something I need. But the transitions between pages/scenes, fades, hover buttons, etc. are important.

#10

Russ,

I answered this in your other post. Certainly doable within Hype I believe. If you need help let me know or post on here :smile:

FYI You can link to other posts within your post.

Just click on the symbol underneath the post in question. :wink: and then paste the link into the other post.

D