Mobile/touchscreen interface demo

      No Comments on Mobile/touchscreen interface demo

In the previous public version (v6) of the demo, released during our attempt at a Kickstarter, Midnight Stranger-style mouse navigation was implemented: the mouse cursor changes when it’s over a hotspot that you can click on. This was critical to get working to show that the navigation features in the original could be implemented in HTML5/Javascript.

New in this version (v8): we have implemented our first attempt at a touchscreen interface! It supports drag and poke actions. The original Midnight Stranger mouse interface relied on changing the cursor to indicate when it’s over a spot that does something (a hotspot), but that is not useful when using a touchscreen (if for no other reason, your finger would be over it and you couldn’t see it as you moved). To that end, when using a touchscreen, a flag in the upper right corner indicates when your finger is dragged over or you poke at a hotspot. If you are dragging, when you release your finger, a circle is shown where you lifted from so that if you were over a hotspot, you can poke that same spot to activate it. Similarly, if you poke around looking for hotspots, a circle is drawn where you poke; and if you poked a hotspot, you can poke it again to activate it. The flag in the upper right corner will tell you if you were on a hotspot. If you drag to or poke on a hotspot and then drag or poke somewhere else (not on the hotspot just selected), then it forgets where you were and you start again. So, with the touchscreen there are two “modes”: searching for hotspots and, when a hotspot has already been dragged to or poked at, dragging to or poking it again will activate it. Note: on slower devices (which I have done a lot of my testing on), poking around is a better means of exploring a scene as dragging can have a serious lag (on the modern phones we’ve tried, there’s no lag at all).

We think it’s fun to explore the scenes, but in case you have a slow device or don’t share our thrill of the hunt, we have added a button in the upper left for both mouse and touch exploration that will will show or hide where the hotspots are located. Just click or poke at it and it will toggle between the SHOW and HIDE modes. Dashed red rectangles are drawn around the hotspots in the SHOW mode. This is also new in this version (v8).

One of the goals of the Midnight Stranger port has always been to extend the functionality in addition to just getting it running on modern platforms. The touchscreen interface for mobile devices is the first really new thing to be implemented in the demo. Two more demo updates are planned: subtitles, and being able to play ambient sounds loops. The sound loops is the last major feature needed to duplicate the functionality that was available in the original Midnight Stranger (menus and other nuts and bolts stuff will still need to be implemented as part of the final product, but that is going to be pretty straightforward we think). Subtitles, however, are new! In addition to being useful for those who cannot hear the audio, it will allow people to run Midnight Stranger where they can’t or don’t want to listen to the sound. It will, of course, also allow for subtitles in different languages so people all over the world can try it out. Stay tuned for more updates!

You can always check out our latest “stable” version of the demo via: http://obeing.net/ms_techdemo/index.html.

If you would like to be kept up to date on progress, send us an email at listmaster@obeing.net and we’ll add you to our mailing list for general (and infrequent) updates on major milestones or new projects. If you want to be tuned in to the nitty-gritty of what we’re up to with development and testing, the best way is to follow our Twitter account.

Leave a Reply

Your email address will not be published. Required fields are marked *