max height for media?

[Julie Oltman]

Has anyone determined the max height for media yet? I know the max width is 640px, but the manual has a red ?? as a placeholder for height.  

Thanks!

[Julie Oltman]

I have been working with a photoshop template set to 640x500 px and so far it seems to work fairly well...would love some confirmation if this is a good guideline.  Thanks! :-) 

[Charles Leffingwell]

For a png image, I find that 640 width and a 744 height is the maximum that will not cause the image to be able to be moved up and down with finger scrolling on the iPad Air.

[Charles Leffingwell]

On my iPhone 5S for a plaque png I found the absolute maximum height to be without finger scrolling to be 920 pixels.  (640 width)

These are absolute max numbers that I found for plaque still images.  Any text added in the description will cause scrolling.

I have found videos to be a little different.  They only have the top bar when played directly as media.  We mostly use the video ARISjs autoplay HTML5 video element technique and have settled on a width and height of those videos to be 600 height and 450 width.  These are not maximums but are a balance between resolution, video length and file size that works for us.

One thing I am not sure about is the actual resolution the videos are when being served to and displayed in the client.  For example if ARIS always displays video at a pixel width of 320, we could optimize our video resolution to match and then get more video length for the same file size...

[Charles Leffingwell]

Sorry to post so much but I think the pixel ratio is the most important thing if you are trying to maximize the images.

Ipad Air Ratios:

full screen= 1.16:1 (height:width)  (example:744Hx640W or 322Hx320W Note: Both examples fill the screen!)

half screen (to accommodate some text)=0.58:1  (322Hx640W)

iPhone5S Ratios: 

full screen=1.43:1 (height:width) (example: 920Hx640W)

half screen (to accommodate some text)=0.71:1  (460Hx640W)

Also, you can use HTML in your plaque to control size.

ARIS seems to always scale an image to fit the width of the screen.  This can be ugly if the image you have is small.  There are ways to control how the image is presented if the image is smaller than the 640 width.

Example: of controlling image or font size in a plaque with HTML

<video style="float:left" width="150" height="175" autoplay loop>

<source src="http://arisgames.org/server/gamedatav2/7813/arisd00d2175fe8e6c3f8a92931d4a31214c.mp4" type="video/mp4">

</video>

This image is small by design and the text is reduced in size to make a kind of 'credit' at the bottom of the screen at the end of my game.

<p style="font-size:xx-small">This work is licensed under the Creative Commons Attribution 4.0 International License.<br/><img src="http://arisgames.org/server/gamedatav2/7813/arisc7034928918a3e56b6977af497b22883.png">

</p>

[Julie Oltman]

This is all super helpful, Charles! Keep it coming 😃

Julie Oltman

Lehigh University

--
--
You are part of the ARIS authoring discussion group.
To post: email aris...@googlegroups.com
To unsubscribe: email arisgames+...@googlegroups.com
For more options: http://groups.google.com/group/arisgames
---
You received this message because you are subscribed to a topic in the Google Groups "arisgames" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/arisgames/mKOu7Q47vOI/unsubscribe.
To unsubscribe from this group and all its topics, send an email to arisgames+...@googlegroups.com.
Visit this group at http://groups.google.com/group/arisgames.
To view this discussion on the web visit https://groups.google.com/d/msgid/arisgames/611ca7f4-176a-4189-84e2-6263713a2c3d%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Christopher Holden]

This is super helpful, and details on images and video are some of the more important things when it comes to optimizing one's design. There are some details we need from the dev. side but some things we can flesh out on our own. Unfortunately, there are a lot of little complications that make it difficult to develop a comprehensive knowledge that results in easy recommendations. This might be a good chance to collect more info and update the manual accordingly, and Charles has us off to a good start. Here are a few categories of info we need.

Plaques

Device Independent

• Top-aligned, fit to width (images and video thumbnail)
  
• white background (important for transparent pngs)
  
• As long as you want, player might need to scroll
  
• videos play in fullscreen, can be rotated by player
  
• Audio media renders a tiny thumbnail huge and does not play for me.
  

No text - full screen

iPad full screen: 744Hx640W

iPhone 5s full screen: 920Hx640W - I seem to be able to fit 960H(?)

iPhone 6 full screen:

iPhone 6+ full screen:

Text visible - maximum height to show at least some of the first line of text

iPad: 

iPhone 5s:

iPhone 6:

iPhone 6+:

Height of one line of text and space before another line

iPad: 

iPhone 5s:

iPhone 6:

iPhone 6+:

Character media in conversations

Device Independent

• Top-aligned, fit to width (images and video thumbnail—misaligned from play button)
  
• Short images have black bottom bar, Long images can not be scrolled to.
  
• black background (important for transparent pngs, short images)
  
• videos play in place, fit-width, almost centered vertically, cannot be rotated.
  
• Audio renders a giant thumbnail as with plaques, but does play.
  

iPad full screen: 

iPhone 5s full screen: 640Wx???H

iPhone 6 full screen:

iPhone 6+ full screen:

Items

Device Independent

• Alignment?
  
• Zoomable - go ahead and use huge images if you want
  
• video?
  
• audio?

iPad full screen: 

iPhone 5s full screen:

iPhone 6 full screen:

iPhone 6+ full screen:

General

Since the ARIS iPad version was an upscaled iPhone version, and there was only one iPhone screen resolution, this meant there used to be a constant 640px to go for. Even recently, the ARIS app simply upscaled the old resolution to the new devices. I don't think it works like this anymore, but don't know the details. In light of any other info, and as a first approximation, I'd still use 640.

If you use HTML or Javascript to insert images and video, you have more flexibility in where and how media renders.

Everything else is specific to what ARIS object we are talking about.

Plaques images can be as short or long as you want. As Charles reports, there only so much that will fit on the screen before a player has to scroll down to see it or the text below. This is a key usability issue because new ARIS users often don't know that they can scroll down.

Other than how they are rendered, I would think videos and images have the same maximum available pixels.

You received this message because you are subscribed to the Google Groups "arisgames" group.
To unsubscribe from this group and stop receiving emails from it, send an email to arisgames+...@googlegroups.com.

Visit this group at http://groups.google.com/group/arisgames.

To view this discussion on the web visit https://groups.google.com/d/msgid/arisgames/3C6BC72D-997C-42E8-B9AB-865421D8379A%40lehigh.edu.

[Charles Leffingwell]

One thing we could do is post a 'game' of media samples, and then share the code we used to create them.

Why not use ARIS to document ARIS?

[Christopher Holden]

We started to do this last year as the release of ARIS 2 came near. The Media one though never got finished, and requires more complex testing procedures when you want to know things like specific pixel dimensions. I'd love some help there. I'll add you to the game if you send me your user id.

On Thu, Nov 12, 2015 at 2:06 PM, Charles Leffingwell <charlesle...@gmail.com> wrote:

One thing we could do is post a 'game' of media samples, and then share the code we used to create them.

Why not use ARIS to document ARIS?

--
--
You are part of the ARIS authoring discussion group.
To post: email aris...@googlegroups.com
To unsubscribe: email arisgames+...@googlegroups.com
For more options: http://groups.google.com/group/arisgames
---
You received this message because you are subscribed to the Google Groups "arisgames" group.
To unsubscribe from this group and stop receiving emails from it, send an email to arisgames+...@googlegroups.com.
Visit this group at http://groups.google.com/group/arisgames.

To view this discussion on the web visit https://groups.google.com/d/msgid/arisgames/77a56e2a-f1a2-409d-8dd2-26467b3f95a1%40googlegroups.com.

[Charles Leffingwell]

chasleff

[Christopher Holden]

You're in

On Thu, Nov 12, 2015 at 2:56 PM, Charles Leffingwell <charlesle...@gmail.com> wrote:

chasleff

--
--
You are part of the ARIS authoring discussion group.
To post: email aris...@googlegroups.com
To unsubscribe: email arisgames+...@googlegroups.com
For more options: http://groups.google.com/group/arisgames
---
You received this message because you are subscribed to the Google Groups "arisgames" group.
To unsubscribe from this group and stop receiving emails from it, send an email to arisgames+...@googlegroups.com.
Visit this group at http://groups.google.com/group/arisgames.

To view this discussion on the web visit https://groups.google.com/d/msgid/arisgames/d85b1556-2c80-427c-b11c-1a1228a69a4a%40googlegroups.com.