Best practise approach for artwork for iOS and Android?

classic Classic list List threaded Threaded
13 messages Options
Reply | Threaded
Open this post in threaded view
|

Best practise approach for artwork for iOS and Android?

Tore Nilsen via use-livecode
Hi,

I have three old windows program (going back to the 90th), designed for
children, which are based on "full window" image backgrounds (douzends of
cards, each with another background image) and lots of small detail images.
Up to now I have only developed LiveCode for Windows and MacOS, no
experience yet with iOS and Android development. I try to evaluate the work
load to redevelop those old windows programs for mobile and one general
question before I start is the art work. Since the old art work has a size
about 800x600 by 72dpi, I obviously would need to let redesign all art work
for the todays resolutions, which would be a pretty costly part of the
project and probably the go or nogo for the whole project.

 

Since there are so many different screen sizes, resolutions and aspect
ratios on iOS and Android, I wonder how to cover all those variants
technically in LiveCode and basically from the art work side. E.g. which
size and ratio I would have to let create the "master" images by the artist
(to be also on the safe side for the next years)?

Since I can't let design for each ratio a different master image for each
card, I probably would have to distort the "master" image to each different
screen size (app only for tablets in landscape mode)? Could I let make the
OS the distortion of one background image per card in LiveCode, or would I
need to import and assign different images (which I have distored in
photoshop before) for each screen size in each card? Additionally I would
need to create douzends of polygons as clickable objects, above each image
for small parts of it, where I am not sure, if they would keep their exact
target area, when the background image will be distort - probably not.

 

Up to now it looks to me as a never ending story, but perhaps I don't see a
good approach

Any experience or pointers to a how to are very welcome.

 

Tiemo

 

 

 

_______________________________________________
use-livecode mailing list
[hidden email]
Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode
Reply | Threaded
Open this post in threaded view
|

Re: Best practise approach for artwork for iOS and Android?

Tore Nilsen via use-livecode
If you use the imagery you have, don’t distort it to fill the screen. That always looks bad. Add white space and/or crop but keep the proportions correct.

If you run them through a smoothing filter to up the dpi, you will want to bit poke each image to restore sharp corners that should not have been rounded.

Personally, if the app worked well with the images you had, and redoing them is your big go/no go, I’d use the images you have. If one app gains traction, perhaps v2 has new images.

Toss them all against the wall and see what sticks.

My two cents.

Kee Nethery


On Jun 11, 2018, at 1:54 AM, Tiemo Hollmann TB via use-livecode <[hidden email]> wrote:

> Hi,
>
> I have three old windows program (going back to the 90th), designed for
> children, which are based on "full window" image backgrounds (douzends of
> cards, each with another background image) and lots of small detail images.
> Up to now I have only developed LiveCode for Windows and MacOS, no
> experience yet with iOS and Android development. I try to evaluate the work
> load to redevelop those old windows programs for mobile and one general
> question before I start is the art work. Since the old art work has a size
> about 800x600 by 72dpi, I obviously would need to let redesign all art work
> for the todays resolutions, which would be a pretty costly part of the
> project and probably the go or nogo for the whole project.
>
>
>
> Since there are so many different screen sizes, resolutions and aspect
> ratios on iOS and Android, I wonder how to cover all those variants
> technically in LiveCode and basically from the art work side. E.g. which
> size and ratio I would have to let create the "master" images by the artist
> (to be also on the safe side for the next years)?
>
> Since I can't let design for each ratio a different master image for each
> card, I probably would have to distort the "master" image to each different
> screen size (app only for tablets in landscape mode)? Could I let make the
> OS the distortion of one background image per card in LiveCode, or would I
> need to import and assign different images (which I have distored in
> photoshop before) for each screen size in each card? Additionally I would
> need to create douzends of polygons as clickable objects, above each image
> for small parts of it, where I am not sure, if they would keep their exact
> target area, when the background image will be distort - probably not.
>
>
>
> Up to now it looks to me as a never ending story, but perhaps I don't see a
> good approach
>
> Any experience or pointers to a how to are very welcome.
>
>
>
> Tiemo
>
>
>
>
>
>
>
> _______________________________________________
> use-livecode mailing list
> [hidden email]
> Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
> http://lists.runrev.com/mailman/listinfo/use-livecode


_______________________________________________
use-livecode mailing list
[hidden email]
Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode
Reply | Threaded
Open this post in threaded view
|

Re: Best practise approach for artwork for iOS and Android?

Tore Nilsen via use-livecode
In reply to this post by Tore Nilsen via use-livecode
I would bulk-convert all the images to a higher resolution, perhaps
144dpi. On Mac, Graphic Converter can batch process these in seconds,
and I am sure there are other programs that do the same on both Mac and
Windows. Use these higher-resolution images in your project.

On mobile, use fullScreenMode "showAll", which will automatically adjust
the display to fit any resolution and screen size on both iOS and
Android. Depending on the original card size, some edges will either be
cropped or empty space will be added. There are ways around this, mainly
by displaying an image at a larger size than the (original) card size.

There was a bug in the showAll fullscreenmode when navigating cards, but
that has just been fixed and will be in the next 9.0 release. There are
also workarounds for this right now if you don't want to wait.

This is a quick process that doesn't take much time because you won't
have to adjust every image.

On 6/11/18 3:54 AM, Tiemo Hollmann TB via use-livecode wrote:

> Hi,
>
> I have three old windows program (going back to the 90th), designed for
> children, which are based on "full window" image backgrounds (douzends of
> cards, each with another background image) and lots of small detail images.
> Up to now I have only developed LiveCode for Windows and MacOS, no
> experience yet with iOS and Android development. I try to evaluate the work
> load to redevelop those old windows programs for mobile and one general
> question before I start is the art work. Since the old art work has a size
> about 800x600 by 72dpi, I obviously would need to let redesign all art work
> for the todays resolutions, which would be a pretty costly part of the
> project and probably the go or nogo for the whole project.
>
>  
>
> Since there are so many different screen sizes, resolutions and aspect
> ratios on iOS and Android, I wonder how to cover all those variants
> technically in LiveCode and basically from the art work side. E.g. which
> size and ratio I would have to let create the "master" images by the artist
> (to be also on the safe side for the next years)?
>
> Since I can't let design for each ratio a different master image for each
> card, I probably would have to distort the "master" image to each different
> screen size (app only for tablets in landscape mode)? Could I let make the
> OS the distortion of one background image per card in LiveCode, or would I
> need to import and assign different images (which I have distored in
> photoshop before) for each screen size in each card? Additionally I would
> need to create douzends of polygons as clickable objects, above each image
> for small parts of it, where I am not sure, if they would keep their exact
> target area, when the background image will be distort - probably not.
>
>  
>
> Up to now it looks to me as a never ending story, but perhaps I don't see a
> good approach
>
> Any experience or pointers to a how to are very welcome.


--
Jacqueline Landman Gay         |     [hidden email]
HyperActive Software           |     http://www.hyperactivesw.com

_______________________________________________
use-livecode mailing list
[hidden email]
Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode
Reply | Threaded
Open this post in threaded view
|

Re: Best practise approach for artwork for iOS and Android?

Tore Nilsen via use-livecode
In reply to this post by Tore Nilsen via use-livecode
Other replied on resolution. I'll reply as to content. You may not have the option, but there is a "safe zone" for landscape and portrait.

We recently hire an artist to do a kid's story. She was asked to put "sky" the top and "grass" and the bottom and significant elements in "safe zone"  

Later we are will set the image to "the loc of this card"   (centered)

On devices that crop, we lose the top and bottom but significant elements remain visible.

Is this helpful?  Probably not... if it is, I have a "safe zone" stack I can send you.

Brahmanathaswami
 

On 6/10/18, 10:55 PM, "use-livecode on behalf of Tiemo Hollmann TB via use-livecode" <[hidden email] on behalf of [hidden email]> wrote:

    Up to now it looks to me as a never ending story, but perhaps I don't see a
    good approach
   
    Any experience or pointers to a how to are very welcome.

_______________________________________________
use-livecode mailing list
[hidden email]
Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode
Reply | Threaded
Open this post in threaded view
|

AW: Best practise approach for artwork for iOS and Android?

Tore Nilsen via use-livecode
Hi Brahmanathaswami,

this is a very clever approach, I would use, if I would make a new design of the images. In my case I can't add "sky" or "bottom-grass".

Thanks for the idea
Tiemo


-----Ursprüngliche Nachricht-----
Von: use-livecode [mailto:[hidden email]] Im Auftrag von Sannyasin Brahmanathaswami via use-livecode
Gesendet: Dienstag, 12. Juni 2018 02:22
An: How to use LiveCode <[hidden email]>
Cc: Sannyasin Brahmanathaswami <[hidden email]>
Betreff: Re: Best practise approach for artwork for iOS and Android?

Other replied on resolution. I'll reply as to content. You may not have the option, but there is a "safe zone" for landscape and portrait.

We recently hire an artist to do a kid's story. She was asked to put "sky" the top and "grass" and the bottom and significant elements in "safe zone"  

Later we are will set the image to "the loc of this card"   (centered)

On devices that crop, we lose the top and bottom but significant elements remain visible.

Is this helpful?  Probably not... if it is, I have a "safe zone" stack I can send you.

Brahmanathaswami
 

On 6/10/18, 10:55 PM, "use-livecode on behalf of Tiemo Hollmann TB via use-livecode" <[hidden email] on behalf of [hidden email]> wrote:

    Up to now it looks to me as a never ending story, but perhaps I don't see a
    good approach
   
    Any experience or pointers to a how to are very welcome.

_______________________________________________
use-livecode mailing list
[hidden email]
Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode


_______________________________________________
use-livecode mailing list
[hidden email]
Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode
Reply | Threaded
Open this post in threaded view
|

AW: Best practise approach for artwork for iOS and Android?

Tore Nilsen via use-livecode
In reply to this post by Tore Nilsen via use-livecode
Hi Jacque,

I thought the dpi only reflects at print, because any screen has it's fixed
pixels. I think an image 800x600 with 144 dpi looks identical on any screen,
as an image 800x600 with 72 dpi because in both cases 800x600 screen pixels
are being used and there is nothing between the pixels. Or don't I see
anything here?

But perhaps I really hould try to start the project with the old 800x600
images, as you and also Kee Nethery pointed out. In this case I am not sure
what would give the better quality in point-of-view resolution. Importing
the original old 800x600 images into LiveCode and let the LiveCode engine
stretch (not distore) the images to a full screen size (with white space on
some edges at some disply sizes), or would photoshop make a better job in
interpolating pixels, if I would enlarge all images in photoshop to lets say
2732x2014 (or even 3200x2400) and let the LiveCode engine shrink the images
to fit each screen.

Tiemo


-----Ursprüngliche Nachricht-----
Von: use-livecode [mailto:[hidden email]] Im Auftrag
von J. Landman Gay via use-livecode
Gesendet: Montag, 11. Juni 2018 21:58
An: How to use LiveCode <[hidden email]>
Cc: J. Landman Gay <[hidden email]>
Betreff: Re: Best practise approach for artwork for iOS and Android?

I would bulk-convert all the images to a higher resolution, perhaps 144dpi.
On Mac, Graphic Converter can batch process these in seconds, and I am sure
there are other programs that do the same on both Mac and Windows. Use these
higher-resolution images in your project.

On mobile, use fullScreenMode "showAll", which will automatically adjust the
display to fit any resolution and screen size on both iOS and Android.
Depending on the original card size, some edges will either be cropped or
empty space will be added. There are ways around this, mainly by displaying
an image at a larger size than the (original) card size.

There was a bug in the showAll fullscreenmode when navigating cards, but
that has just been fixed and will be in the next 9.0 release. There are also
workarounds for this right now if you don't want to wait.

This is a quick process that doesn't take much time because you won't have
to adjust every image.

On 6/11/18 3:54 AM, Tiemo Hollmann TB via use-livecode wrote:
> Hi,
>
> I have three old windows program (going back to the 90th), designed
> for children, which are based on "full window" image backgrounds
> (douzends of cards, each with another background image) and lots of small
detail images.
> Up to now I have only developed LiveCode for Windows and MacOS, no
> experience yet with iOS and Android development. I try to evaluate the
> work load to redevelop those old windows programs for mobile and one
> general question before I start is the art work. Since the old art
> work has a size about 800x600 by 72dpi, I obviously would need to let
> redesign all art work for the todays resolutions, which would be a
> pretty costly part of the project and probably the go or nogo for the
whole project.

>
>  
>
> Since there are so many different screen sizes, resolutions and aspect
> ratios on iOS and Android, I wonder how to cover all those variants
> technically in LiveCode and basically from the art work side. E.g.
> which size and ratio I would have to let create the "master" images by
> the artist (to be also on the safe side for the next years)?
>
> Since I can't let design for each ratio a different master image for
> each card, I probably would have to distort the "master" image to each
> different screen size (app only for tablets in landscape mode)? Could
> I let make the OS the distortion of one background image per card in
> LiveCode, or would I need to import and assign different images (which
> I have distored in photoshop before) for each screen size in each
> card? Additionally I would need to create douzends of polygons as
> clickable objects, above each image for small parts of it, where I am
> not sure, if they would keep their exact target area, when the background
image will be distort - probably not.
>
>  
>
> Up to now it looks to me as a never ending story, but perhaps I don't
> see a good approach
>
> Any experience or pointers to a how to are very welcome.


--
Jacqueline Landman Gay         |     [hidden email]
HyperActive Software           |     http://www.hyperactivesw.com

_______________________________________________
use-livecode mailing list
[hidden email]
Please visit this url to subscribe, unsubscribe and manage your subscription
preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode


_______________________________________________
use-livecode mailing list
[hidden email]
Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode
Reply | Threaded
Open this post in threaded view
|

Re: Best practise approach for artwork for iOS and Android?

Tore Nilsen via use-livecode
In reply to this post by Tore Nilsen via use-livecode
Hi,

I don't know what sort of images you have but take a look at xara (
xara.com/designer-pro/features)

Scroll down to the intelligent scaling video - better yet they have a trial.

I think the intelligent scaling might even give you the "safe Zone" that SB
mentioned

Regards Lagi

Lagi

On Mon, 11 Jun 2018 at 14:48, Kee Nethery via use-livecode <
[hidden email]> wrote:

> If you use the imagery you have, don’t distort it to fill the screen. That
> always looks bad. Add white space and/or crop but keep the proportions
> correct.
>
> If you run them through a smoothing filter to up the dpi, you will want to
> bit poke each image to restore sharp corners that should not have been
> rounded.
>
> Personally, if the app worked well with the images you had, and redoing
> them is your big go/no go, I’d use the images you have. If one app gains
> traction, perhaps v2 has new images.
>
> Toss them all against the wall and see what sticks.
>
> My two cents.
>
> Kee Nethery
>
>
> On Jun 11, 2018, at 1:54 AM, Tiemo Hollmann TB via use-livecode <
> [hidden email]> wrote:
>
> > Hi,
> >
> > I have three old windows program (going back to the 90th), designed for
> > children, which are based on "full window" image backgrounds (douzends of
> > cards, each with another background image) and lots of small detail
> images.
> > Up to now I have only developed LiveCode for Windows and MacOS, no
> > experience yet with iOS and Android development. I try to evaluate the
> work
> > load to redevelop those old windows programs for mobile and one general
> > question before I start is the art work. Since the old art work has a
> size
> > about 800x600 by 72dpi, I obviously would need to let redesign all art
> work
> > for the todays resolutions, which would be a pretty costly part of the
> > project and probably the go or nogo for the whole project.
> >
> >
> >
> > Since there are so many different screen sizes, resolutions and aspect
> > ratios on iOS and Android, I wonder how to cover all those variants
> > technically in LiveCode and basically from the art work side. E.g. which
> > size and ratio I would have to let create the "master" images by the
> artist
> > (to be also on the safe side for the next years)?
> >
> > Since I can't let design for each ratio a different master image for each
> > card, I probably would have to distort the "master" image to each
> different
> > screen size (app only for tablets in landscape mode)? Could I let make
> the
> > OS the distortion of one background image per card in LiveCode, or would
> I
> > need to import and assign different images (which I have distored in
> > photoshop before) for each screen size in each card? Additionally I would
> > need to create douzends of polygons as clickable objects, above each
> image
> > for small parts of it, where I am not sure, if they would keep their
> exact
> > target area, when the background image will be distort - probably not.
> >
> >
> >
> > Up to now it looks to me as a never ending story, but perhaps I don't
> see a
> > good approach
> >
> > Any experience or pointers to a how to are very welcome.
> >
> >
> >
> > Tiemo
> >
> >
> >
> >
> >
> >
> >
> > _______________________________________________
> > use-livecode mailing list
> > [hidden email]
> > Please visit this url to subscribe, unsubscribe and manage your
> subscription preferences:
> > http://lists.runrev.com/mailman/listinfo/use-livecode
>
>
> _______________________________________________
> use-livecode mailing list
> [hidden email]
> Please visit this url to subscribe, unsubscribe and manage your
> subscription preferences:
> http://lists.runrev.com/mailman/listinfo/use-livecode
_______________________________________________
use-livecode mailing list
[hidden email]
Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode
Reply | Threaded
Open this post in threaded view
|

AW: Best practise approach for artwork for iOS and Android?

Tore Nilsen via use-livecode
Hi Lagi,

faszinating tool!

Tiemo

-----Ursprüngliche Nachricht-----
Von: use-livecode [mailto:[hidden email]] Im Auftrag von Lagi Pittas via use-livecode
Gesendet: Dienstag, 12. Juni 2018 11:18
An: How to use LiveCode <[hidden email]>
Cc: Lagi Pittas <[hidden email]>
Betreff: Re: Best practise approach for artwork for iOS and Android?

Hi,

I don't know what sort of images you have but take a look at xara (
xara.com/designer-pro/features)

Scroll down to the intelligent scaling video - better yet they have a trial.

I think the intelligent scaling might even give you the "safe Zone" that SB mentioned

Regards Lagi

Lagi

On Mon, 11 Jun 2018 at 14:48, Kee Nethery via use-livecode < [hidden email]> wrote:

> If you use the imagery you have, don’t distort it to fill the screen.
> That always looks bad. Add white space and/or crop but keep the
> proportions correct.
>
> If you run them through a smoothing filter to up the dpi, you will
> want to bit poke each image to restore sharp corners that should not
> have been rounded.
>
> Personally, if the app worked well with the images you had, and
> redoing them is your big go/no go, I’d use the images you have. If one
> app gains traction, perhaps v2 has new images.
>
> Toss them all against the wall and see what sticks.
>
> My two cents.
>
> Kee Nethery
>
>
> On Jun 11, 2018, at 1:54 AM, Tiemo Hollmann TB via use-livecode <
> [hidden email]> wrote:
>
> > Hi,
> >
> > I have three old windows program (going back to the 90th), designed
> > for children, which are based on "full window" image backgrounds
> > (douzends of cards, each with another background image) and lots of
> > small detail
> images.
> > Up to now I have only developed LiveCode for Windows and MacOS, no
> > experience yet with iOS and Android development. I try to evaluate
> > the
> work
> > load to redevelop those old windows programs for mobile and one
> > general question before I start is the art work. Since the old art
> > work has a
> size
> > about 800x600 by 72dpi, I obviously would need to let redesign all
> > art
> work
> > for the todays resolutions, which would be a pretty costly part of
> > the project and probably the go or nogo for the whole project.
> >
> >
> >
> > Since there are so many different screen sizes, resolutions and
> > aspect ratios on iOS and Android, I wonder how to cover all those
> > variants technically in LiveCode and basically from the art work
> > side. E.g. which size and ratio I would have to let create the
> > "master" images by the
> artist
> > (to be also on the safe side for the next years)?
> >
> > Since I can't let design for each ratio a different master image for
> > each card, I probably would have to distort the "master" image to
> > each
> different
> > screen size (app only for tablets in landscape mode)? Could I let
> > make
> the
> > OS the distortion of one background image per card in LiveCode, or
> > would
> I
> > need to import and assign different images (which I have distored in
> > photoshop before) for each screen size in each card? Additionally I
> > would need to create douzends of polygons as clickable objects,
> > above each
> image
> > for small parts of it, where I am not sure, if they would keep their
> exact
> > target area, when the background image will be distort - probably not.
> >
> >
> >
> > Up to now it looks to me as a never ending story, but perhaps I
> > don't
> see a
> > good approach
> >
> > Any experience or pointers to a how to are very welcome.
> >
> >
> >
> > Tiemo
> >
> >
> >
> >
> >
> >
> >
> > _______________________________________________
> > use-livecode mailing list
> > [hidden email]
> > Please visit this url to subscribe, unsubscribe and manage your
> subscription preferences:
> > http://lists.runrev.com/mailman/listinfo/use-livecode
>
>
> _______________________________________________
> use-livecode mailing list
> [hidden email]
> Please visit this url to subscribe, unsubscribe and manage your
> subscription preferences:
> http://lists.runrev.com/mailman/listinfo/use-livecode
_______________________________________________
use-livecode mailing list
[hidden email]
Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode


_______________________________________________
use-livecode mailing list
[hidden email]
Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode
Reply | Threaded
Open this post in threaded view
|

Re: AW: Best practise approach for artwork for iOS and Android?

Tore Nilsen via use-livecode
In reply to this post by Tore Nilsen via use-livecode
You may be right, I should have said to double the size. The idea is to
give LC more pixels to work with when it scales the card content. But LC is
pretty good at scaling, so starting with the originals may work fine.

--
Jacqueline Landman Gay | [hidden email]
HyperActive Software | http://www.hyperactivesw.com
On June 12, 2018 2:03:31 AM Tiemo Hollmann TB via use-livecode
<[hidden email]> wrote:

> Hi Jacque,
>
> I thought the dpi only reflects at print, because any screen has it's fixed
> pixels. I think an image 800x600 with 144 dpi looks identical on any screen,
> as an image 800x600 with 72 dpi because in both cases 800x600 screen pixels
> are being used and there is nothing between the pixels. Or don't I see
> anything here?
>
> But perhaps I really hould try to start the project with the old 800x600
> images, as you and also Kee Nethery pointed out. In this case I am not sure
> what would give the better quality in point-of-view resolution. Importing
> the original old 800x600 images into LiveCode and let the LiveCode engine
> stretch (not distore) the images to a full screen size (with white space on
> some edges at some disply sizes), or would photoshop make a better job in
> interpolating pixels, if I would enlarge all images in photoshop to lets say
> 2732x2014 (or even 3200x2400) and let the LiveCode engine shrink the images
> to fit each screen.
>
> Tiemo
>
>
> -----Ursprüngliche Nachricht-----
> Von: use-livecode [mailto:[hidden email]] Im Auftrag
> von J. Landman Gay via use-livecode
> Gesendet: Montag, 11. Juni 2018 21:58
> An: How to use LiveCode <[hidden email]>
> Cc: J. Landman Gay <[hidden email]>
> Betreff: Re: Best practise approach for artwork for iOS and Android?
>
> I would bulk-convert all the images to a higher resolution, perhaps 144dpi.
> On Mac, Graphic Converter can batch process these in seconds, and I am sure
> there are other programs that do the same on both Mac and Windows. Use these
> higher-resolution images in your project.
>
> On mobile, use fullScreenMode "showAll", which will automatically adjust the
> display to fit any resolution and screen size on both iOS and Android.
> Depending on the original card size, some edges will either be cropped or
> empty space will be added. There are ways around this, mainly by displaying
> an image at a larger size than the (original) card size.
>
> There was a bug in the showAll fullscreenmode when navigating cards, but
> that has just been fixed and will be in the next 9.0 release. There are also
> workarounds for this right now if you don't want to wait.
>
> This is a quick process that doesn't take much time because you won't have
> to adjust every image.
>
> On 6/11/18 3:54 AM, Tiemo Hollmann TB via use-livecode wrote:
>> Hi,
>>
>> I have three old windows program (going back to the 90th), designed
>> for children, which are based on "full window" image backgrounds
>> (douzends of cards, each with another background image) and lots of small
> detail images.
>> Up to now I have only developed LiveCode for Windows and MacOS, no
>> experience yet with iOS and Android development. I try to evaluate the
>> work load to redevelop those old windows programs for mobile and one
>> general question before I start is the art work. Since the old art
>> work has a size about 800x600 by 72dpi, I obviously would need to let
>> redesign all art work for the todays resolutions, which would be a
>> pretty costly part of the project and probably the go or nogo for the
> whole project.
>>
>>
>>
>> Since there are so many different screen sizes, resolutions and aspect
>> ratios on iOS and Android, I wonder how to cover all those variants
>> technically in LiveCode and basically from the art work side. E.g.
>> which size and ratio I would have to let create the "master" images by
>> the artist (to be also on the safe side for the next years)?
>>
>> Since I can't let design for each ratio a different master image for
>> each card, I probably would have to distort the "master" image to each
>> different screen size (app only for tablets in landscape mode)? Could
>> I let make the OS the distortion of one background image per card in
>> LiveCode, or would I need to import and assign different images (which
>> I have distored in photoshop before) for each screen size in each
>> card? Additionally I would need to create douzends of polygons as
>> clickable objects, above each image for small parts of it, where I am
>> not sure, if they would keep their exact target area, when the background
> image will be distort - probably not.
>>
>>
>>
>> Up to now it looks to me as a never ending story, but perhaps I don't
>> see a good approach
>>
>> Any experience or pointers to a how to are very welcome.
>
>
> --
> Jacqueline Landman Gay         |     [hidden email]
> HyperActive Software           |     http://www.hyperactivesw.com
>
> _______________________________________________
> use-livecode mailing list
> [hidden email]
> Please visit this url to subscribe, unsubscribe and manage your subscription
> preferences:
> http://lists.runrev.com/mailman/listinfo/use-livecode
>
>
> _______________________________________________
> use-livecode mailing list
> [hidden email]
> Please visit this url to subscribe, unsubscribe and manage your
> subscription preferences:
> http://lists.runrev.com/mailman/listinfo/use-livecode




_______________________________________________
use-livecode mailing list
[hidden email]
Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode
Reply | Threaded
Open this post in threaded view
|

Re: Best practise approach for artwork for iOS and Android?

Tore Nilsen via use-livecode
In reply to this post by Tore Nilsen via use-livecode
On Tue, Jun 12, 2018 at 2:01 AM, Tiemo Hollmann TB via use-livecode <
[hidden email]> wrote:

>
> I thought the dpi only reflects at print, because any screen has it's fixed
> pixels. I think an image 800x600 with 144 dpi looks identical on any
> screen,
> as an image 800x600 with 72 dpi because in both cases 800x600 screen pixels
> are being used and there is nothing between the pixels. Or don't I see
> anything here?
>

Changing the DPI setting in the image may affect display in image viewing
applications. If you were to change the DDPI setting of an 800x600 image
from 72 to 144 then the image would be displayed as a 400x300 image in an
application like Preview on macOS or Photoshop. LiveCode will display an
image using the natural dimensions by default. That means an image with
800x600 pixels will be displayed as an 800x600 image.

As a developer you could get the `metadata` of an image and check the
`density` key in the resulting array to determine if you should resize the
image based on the density setting. Depending on your application you may
face a new dilemma, however. You have to decide what the base DPI is for
the image. An image with 144 DPI could be a 2x image if created on macOS
(base of 72 DPI) or a 1.5x image if created on Windows (base of 96 DPI).
So that image may need to be displayed at 400x300 or 533x400.

--
Trevor DeVore
ScreenSteps
www.screensteps.com
_______________________________________________
use-livecode mailing list
[hidden email]
Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode
Reply | Threaded
Open this post in threaded view
|

Re: Best practise approach for artwork for iOS and Android?

Tore Nilsen via use-livecode
In reply to this post by Tore Nilsen via use-livecode
on Tue, 12 Jun 2018, Lagi Pittas wrote:
> I don't know what sort of images you have but
> take a look at xara (xara.com/designer-pro/features)

I use Xara Photo Graphic Designer and agree with Lagi's
recommendation. Check these videos about intelligent scaling:

https://www.youtube.com/watch?v=dfNLaZ5cSHs
https://www.youtube.com/watch?v=s9j-WYl0OJY

Al

_______________________________________________
use-livecode mailing list
[hidden email]
Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode
Reply | Threaded
Open this post in threaded view
|

Re: Best practise approach for artwork for iOS and Android?

Tore Nilsen via use-livecode
In reply to this post by Tore Nilsen via use-livecode
Just one thing to add here based on what Trevor mentioned - these are images which you have complete control over so...

If you can upscale them (perhaps using the tool Lagi suggests) with a good degree of visual improvement then you can use the multi-resolution aware feature of referenced (filename) image objects to improve the display of your images on high resolution screens.

Modern devices have screens which are 2-3x the dpi of screens we have lived with for decades - so more pixel data means better quality display.

When you use the filename property such as 'foo.png' the image object will look for images which have name 'foo@<n>x.png' first where x is 1,1.5,2 or 4 based on the number of device pixels available. E.g. On a 2x retina device - it will look for the 2x image and fit it to the logical (the rect) size.

Note: the base size is taken from the 1x image size and the file actually used is based on the 'effective scale' of the total transform from image text to device pixels - so the dpi setting in the images don't matter and it's much more competent than just using the type of screen.

TL;DR: if you can find a tool which can upscale your images acceptably to 2x or even 4x - do so - keep the original
image as foo.png and the upscale ones as foo@2x/4x.png and set the filename of the image with foo.png. The engine should do the rest (from the using as much as it can pixel data wise at least point of view).

Warmest Regards,

Mark.

Sent from my iPhone

> On 12 Jun 2018, at 17:23, Trevor DeVore via use-livecode <[hidden email]> wrote:
>
> On Tue, Jun 12, 2018 at 2:01 AM, Tiemo Hollmann TB via use-livecode <
> [hidden email]> wrote:
>
>>
>> I thought the dpi only reflects at print, because any screen has it's fixed
>> pixels. I think an image 800x600 with 144 dpi looks identical on any
>> screen,
>> as an image 800x600 with 72 dpi because in both cases 800x600 screen pixels
>> are being used and there is nothing between the pixels. Or don't I see
>> anything here?
>>
>
> Changing the DPI setting in the image may affect display in image viewing
> applications. If you were to change the DDPI setting of an 800x600 image
> from 72 to 144 then the image would be displayed as a 400x300 image in an
> application like Preview on macOS or Photoshop. LiveCode will display an
> image using the natural dimensions by default. That means an image with
> 800x600 pixels will be displayed as an 800x600 image.
>
> As a developer you could get the `metadata` of an image and check the
> `density` key in the resulting array to determine if you should resize the
> image based on the density setting. Depending on your application you may
> face a new dilemma, however. You have to decide what the base DPI is for
> the image. An image with 144 DPI could be a 2x image if created on macOS
> (base of 72 DPI) or a 1.5x image if created on Windows (base of 96 DPI).
> So that image may need to be displayed at 400x300 or 533x400.
>
> --
> Trevor DeVore
> ScreenSteps
> www.screensteps.com
> _______________________________________________
> use-livecode mailing list
> [hidden email]
> Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
> http://lists.runrev.com/mailman/listinfo/use-livecode


_______________________________________________
use-livecode mailing list
[hidden email]
Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode
Reply | Threaded
Open this post in threaded view
|

Re: Best practise approach for artwork for iOS and Android?

Tore Nilsen via use-livecode
This work for a few images, but let's say that your app has 100's images. Your package / SA has limits.

I found it easy to settle on a routine. Images 400 X 400 or less I produce at 800 X 800 and run them the TinyJPG and get optimized. So the 2X size work well, in fact in "mandatory" on small image (100 X 50) from full screen images (414 X 736) the 1X, otherwise "eagle eyes" complain

Of course it is not optimal, but from user feedback; they only complain "the image a fuzzy"  when we take an item below a certain rect (400 X 400) AND optimize it AND display a 1X... when the image is bigger, I suspect treatment  of edges and sharpness are still "acceptable" to the eye -- after optimization,  even my eagles eyes users

TinyPNG.com   I have not found any this better. My own command line tool  (run it through ImageMadic and mozjpg)  never come close to TINYpng.com. Works so well that save in photoshop at the native rect (2X for image below 400x400 are save a 800 X 800) and save out at 100% quality  on Photoshop .

 Drop in TINYpng.com (does jpeg as well) and look at savings!\ And test them side by side with the originals.

Of course, is you are doing Ansel Adam coffee book style photographic representations.... that’s a different story. But my users are interest in the content of the photo -- "the documentary" aspect. They hardly notice the photo quality (except for small images, where I think optimization "breaks" the photo)

Brahmanathaswami
 

On 6/12/18, 10:45 AM, "use-livecode on behalf of Mark Waddingham via use-livecode" <[hidden email] on behalf of [hidden email]> wrote:

    TL;DR: if you can find a tool which can upscale your images acceptably to 2x or even 4x - do so - keep the original
    image as foo.png and the upscale ones as foo@2x/4x.png and set the filename of the image with foo.png. The engine should do the rest (from the using as much as it can pixel data wise at least point of view).

_______________________________________________
use-livecode mailing list
[hidden email]
Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode