A Book About Hype (3.5+Pro) šŸ“˜

Progress Update - Sunday, September 20, 2015

Hereā€™s a funny story. Well, it was funny to me. I suppose it is a bit like a mad scientist to be laughing alone in my office. HA!

I was researching the changes in version 1.6 of Hype. I was trying to figure out the right words for the start of the ā€œMultiple Timelinesā€ section. I realized that my idea wouldnā€™t work. However, I noticed something in one of the Hype videos ā€“ the Capo and the Timeline Cursor can be moved together.

Since people seem to want tremendous detail in this book, I decided to add that information to the book. Yet, I felt that it wasnā€™t enough to simply describe the feature with pictures and text alone. It needed motion. Unfortunately, it seems that animated GIFs donā€™t work in iBooks, so I decided to add a video.

OK, hereā€™s the funny part. It was an unusual amount of work for a small 12 second video ā€“ with no audio.

I use an old Mac Mini (Early 2009 model) as my main computer. I upgraded it with an SSD and 8GB of RAM, so I feel that itā€™s fine. The problem is that I donā€™t have a retina display monitor. To compensate for this, I use the ā€œDuetā€ app and an iPad Air 2. Thatā€™s how Iā€™ve been creating the screen shots. This process seems to be working. But when I tried to create a screen capture video using this setup, it didnā€™t work. The video was just a mouse cursor and a black background.

I created the video with my main monitor ā€“ a 1280 x 1024 display. I donā€™t need the full display. Iā€™m just focusing on the timeline. The video was OK, but it wasnā€™t retina quality. Iā€™m not sure if anyone would care, but I felt that the video should be retina quality too. I felt bad. So, I tried another technique.

I have a DVI to HDMI cable. I hooked it up to my HDTV. Using a command in terminal, HiDPI can be activated on old Macs.

My 1080p TV was converted to a 960 x 540 HiDPI display. I recreated the video using this setup and it worked. That was a lot of work for a 12 second video.

Itā€™s been challenging to deliver high-quality images, while working with older hardware and keeping the file size down. Storage space is expensive on iOS devices. I donā€™t want to ship a 1GB+ book. Iā€™m happy with the quality of the images. And now, thereā€™s a small (but Retina quality) video too.

4 Likes

lol thats actually pretty awesomeā€¦ sometimes youā€™ll be surprise what you discover when you push the limits.

1 Like

Iā€™m not sure if it works in the other direction, but I use a tool called SwitchResX. My 5k iMac (seriously Iā€™m not bragging :wink:) doesnā€™t by default have a 1920x1080 retina mode, but this is what we need for videos. Thereā€™s a way using the tool to create all kinds of custom and unsupported video modes on your computer.

1 Like

I tried something similar. It's called ResolutionTab.

I'm thinking the problem isn't the software. It's the hardware. I think the 4:3 monitor is not wide enough for HiDPI. 1280 Ć· 2 = 640. I think that's below the requirements for OS X. This is odd though, as 960 x 540 is also below 800 x 600.

What?! No Mac Pro?! :smile:

When a computer costs over $2500, I feel like it should come with wheels ā€“ so I can drive it.

I'm trying to hold out for the Skylake chips. Once they're out, then it's choosing between the Macbook Air, Macbook Pro, iMac, Mac Mini or Mac Pro... but there's still the possibility I'll keep using my Mac Mini. Juggling monitor cables is annoying, but it is getting the job done.

The beauty is the notion of scaled modes, where you may not have the physical pixels, but OS X can represent the monitor virtually at any size and then at the last minute perform a scale so it will fit on your actual display.

2 Likes

Progress Update - Thursday, September 24, 2015

I'm not feeling too good. I think I have a cold. Heh, I think it's too much sitting and the change of weather. I'm not quite hitting my writing goals. Although, the interactive examples are turning out a bit better than expected.

I'm working hard to keep the book size down. The same applies to the interactive examples. One of the ways to achieve this is to not use images. Instead, I've been using Hype elements to create artwork.

Currently, I'm working on the "Hype Pro" chapter, the "Symbols" section. I like what I created to explain how Symbols work...

It's two levels of symbols. One is the "electron", which is reused nine times, and the other is the "atom", which is used three times. In the interactive example, the atoms use physics. They can be dragged and flung around. There's no real reason for that. It's just fun to bounce them around.

The GIF (pronounced like the peanut butter) shown above was created with Hype.

I think Apple might be preventing that from happening in certain situations. My 4:3 1280x1024 monitor seems to be one of those situations.

1 Like

Progress Update - Saturday, September 26, 2015

Hey @Daniel @jonathan and @stephen,

It looks like there should be an update to your documentation...

Because of this each scene can have only one instance of each persistent symbol.

I tested that today and it doesn't seem right. I created a Hype project with two Persistent Symbols on the scene. It worked. Did Hype suddenly get more powerful?

I'm not trying to duplicate the existing Hype documentation. The problem was at the end of the "Persistent Symbols" section. I was like... uh... that's it? So, I checked the documentation to see if I missed anything.

I thought this was funny... Tumult Hype Documentation ...We both wrote about the accidental deletion of symbols. Perhaps that says the "Remove when no longer referenced" option shouldn't be enabled by default. That would ruin the usefulness of the feature though. So, perhaps it should be a preference setting. It should be off by default, but brave developers could set it to on by default.

Also, I noticed something with Scene Transitions. If the same transition is used again, it can be less smooth after the first try. The "Swap" transition was causing my persistent menu to flicker. So, I switched it to "Right to Left" transitions. The first time the transition is run, it's OK. Subsequent transitions have a gap between the scenes.

I should be wrapping up the symbols sections today. Wow, it was like Inception... a dream, within a dream, within a dream. I thought I knew how symbols worked. I thought I knew Hype. Working on this book has really pushed my development skills to another level.

4 Likes

Take your time with itā€¦ Although itā€™s a simple concept but when working with May instances and lost of grouping and netting it gets difficult to get scaling right as well as behavior might not be what you expectedā€¦ Iā€™ve been experimenting a lot with themā€¦ Got super lost and greater some kind of ghost particle fx where the shadow of the elements move independently of the symbols itā€™s selfā€¦ And then when physics and consoled by device tilt onā€¦ Thatā€™s where things get really freaky

I was wondering what your plan is for known bugs. Like symbols not retaining ids on export - import

1 Like

I didn't know about that. HA HA! I did mention that symbols can be imported and exported, but I wasn't aware of issues with IDs being lost. (Hey @Daniel @jonathan and @stephen, this seems to be a problem with templates too.)

When I see an issue, I report it. Then, if there isn't a solution, I try to write around the problem. My thinking is that Tumult is good about fixing issues. The idea is to try to give the book at least a one-year shelf life. If I write about issues, and then those issues get fixed, then the book becomes confusing or obsolete.

One of the reasons the book has been moving slower than I'd like is that I've been sending in a lot of feedback to Tumult. I think this whole process is making me a better developer ā€“ but I also think it's making Hype better software too.

Your question is related to something that I'm struggling with right now. I already covered Physics as an Inspector Pane, That part was easy. But now, I'm working on the Hype Pro chapter. I'm trying to write about Physics as a professional feature, even though I know it's not really a professional feature right now. It's a new feature.

So obviously, I'm not trying to bash Tumult or Hype. I like the company and I like the software. Also, I don't know where the software will be nine months from now. Simple additions to Hype could make Physics awesome. Additionally, I'm trying to create useful information for readers too. It's a delicate balance.

I'm still not sure how I'll finish the section, but I figure it's a good idea to go into more detail with Physics. I've been trying to focus on explaining the software. Here's a screenshot...

Instead of writing about what Physics can or can't do, I decided to go into more detail about what it can do. What is Density? What does it do? Hopefully, that's what the interactive example will show. Each of those elliptical elements has a density value. That value is displayed on the element itself. They're draggable, so they can be dropped into the tank. Elements with higher value can fall further into the tank. 1 and 5 float on top. 10 might fall a little lower. 25 ends up near the bottom. 50 and 88 can push all the way through.

It's not the prettiest of examples, but I think it's fun to play with.

This example does a few things...

  • It shows the power of the physics engine. There is potential here.
  • It further explains the density value. It can go higher than 10.
  • It's an example of real life physics. Topics like this make the book more friendly for schools.

Grumbling about the lack of Physics features doesn't really help anyone. That's not what the book is about. That's what this thread is for. :smile:

2 Likes

Im super excited to see this book come to reality. I was just curious to if you have already composed an index detailing all the subject covered and if at this point you were willing to share it.

1 Like

Its been added to their bug list. I am not sure who has access to the whole list or where you would find it. But it may be worth reading through the known Issues threads. if you get a chance. Or see if Tumult can let you peek at a list ?

I think thats a good approach.

1 Like

There's a way to make new custom resolutions in SwitchResX that overrides the system default.

The keyword here is instance; you can have multiple persistent symbols on a scene, but you can't have two instances of the same persistent symbol.

We originally had the opposite during development. We found it was very confusing, especially when you'd make a new scene and persistent symbols that were no where else would show up! I don't think there's a right answer for this, it really goes both ways. That does indicate a preference might be in order, but we like to keep preferences to a minimum for simplicity reasons, teaching reasons, and so one person's environment is similar to another's.

Can you send a zip of a .hype document that reproduces this?

Try inserting a symbol into itself :wink:.

Absolutely! We appreciate all the great feedback; it is rare users dive as deeply as you have and so it is uncovering many items we can (and have in some cases) improved in both functionality and workflow.

You really don't want to look inside the sausage factory :wink:. There are 825 items we have listed as open bugs (this doesn't count crashes!) and 546 open features. Our case numbers go from #1 to #9932.

3 Likes

Back when I was researching this problem, I was wondering if SwitchResX might be better than ResolutionTab. I went with the application that was on the Mac App Store. That's one of the reasons why I went with Hype, as opposed to a competitor.

I'm OK with my current setup. It's getting the job done.

It looks like the book needs updating. HA HA.

I think that makes sense. It also means I don't have to update that section of the book. Basically, I warned about accidental deletion.

Heh, I knew this question was on the way. The problem is that the issue was discovered while making an interactive example for the book. That's still secret. So, I created a new project for testing...

rgb.hypetemplate.zip (42.4 KB)

...the first transition is OK. A white bar is visible in subsequent transitions. It's basically the background bleeding through.

Heh, not since the little robot in Quark XPress have I seen a design app with such an entertaining Easter Egg. HA!

It could be worse. It could be Drupal... https://drupalreleasedate.com ...over 6,000 issues.

yeah! :slight_smile: and deleting an element the third time with all command -keys pressed the robots big brother came along ... great !

so is there a nice animated easteregg within hypeĀæ

1 Like

It's just a funny dialogue box.

I wasn't expecting that. I was wondering what would happen? Would it be like a video camera recording a display of its own video? (Another comparison, a mirror pointed at another mirror.) How would it work? It didn't even occur to me to put a symbol in a symbol. So as I was about to try it, I was imagining some big scenarios.

Heh, and then I saw that. It makes sense. Symbols shouldn't be in symbols. The symbol would displayed an infinite amount of times.

This book doesn't have an index. There is a glossary option in iBooks Author, but I'm not planning to use that for this book. Instead, I have Chapters and Sections. If you wanted to learn about Symbols, there's a "Symbols" section. If you wanted to learn about "Persistent Symbols" there is a section for that too. If you wanted to know about a particular part of the Inspector panel, there is a section for each tab.

The idea is that I'm starting from the beginning, thoroughly explaining the software, and then I move into more advanced and real world topics.

I'm not ready to publish the list yet, as it's still changing.

2 Likes

Progress Update - September 29, 2015

Wow, September is almost over. I better get moving. Iā€™m going right back to work after this post. I was feeling pretty good about the example I just made, so I thought you might like to see a screenshot.

I mentioned the ā€œDensityā€ interactive example before. The screenshot is from the ā€œFrictionā€ example. It looks simple, but there are subtle things going on. The element rolls from left to right. Once the element reaches the right side, the scene automatically resets. The Friction value can be changed with the slider ā€“ while the scene is running. The controls at the bottom left are in a ā€œPersistent Symbolā€, so the Friction setting is consistent. You can load a circle or a square.

I think this is a great learning resource, as you can actually see how the Physics settings work.

I also created a nice interactive example for Bounce / Drag. I have about a dozen of these interactive examples in the book so far. Iā€™m planning to make more.

1 Like

Please take your take with the scaling section as well as best practices for texting symbols and using multiple time linesā€¦ It can be so easy to lost. I love the screen shot above it looks like a great example to illustrate how the physics interacts.

1 Like

Progress Update - Wednesday, September 30, 2015

Iā€™m working on the JavaScript chapter now. A major issue arose. I wasnā€™t sure how to settle a bitter debate ā€“ Should semicolons always be used or is ASI (Automatic Semicolon Insertion) good enough?

I noticed that Tumult uses semicolons in their examples. Theyā€™re aggressive about reducing the size of their JavaScript code, so thereā€™s probably a good reason why they use it.

Previously, I was using semicolons all the time. But lately, there seems to be a trend in excluding them. (Swift doesnā€™t require semicolons either.) I was shocked to see that I could remove all of the semicolons from one of my Hype projects and nothing bad happened. I tested another project. It was also OK without semicolons. I tested a third, uploaded it to the server, to see if there would be minification issue. Nope, just the usual JavaScript issues I didnā€™t get around to fixing yet. HA!

Learning about ASI has certainly changed my JavaScript writing style. Iā€™m seriously thinking about dropping semicolons when theyā€™re not necessary.

Personally, Iā€™ve always hated them. It seemed superfluous. Yet, I donā€™t think Iā€™m going to to settle the debate. A lot of developers are using semicolons because thatā€™s what theyā€™ve always done or because thatā€™s what theyā€™re used to from other programming languages. I doubt Iā€™m going to change their minds.

However, people that are new to JavaScript wonā€™t have an opinion on this matter. Every line of code that future developers write could be partially influenced by me. This feels like a big responsibility.

Update: I might change my mind on this one, but Iā€™m starting to think semicolons should be used. Itā€™s not just fear, uncertainty and doubt. There are legitimate concerns. I donā€™t think theyā€™re major concerns, but itā€™s enough for me to feel bad about excluding them.

1 Like

I hope youā€™re feeling energized about the book-Hereā€™s what Iā€™m struggling with -Iā€™m working on a fixed layout iBook with pages that are HTML5 widget scenes built in Hype Pro. Several elements will be physics powered, which is great for mobile. But iBooks is also available for Macintosh. How do I make it just as entertaining?