Technical UI in Mobile Games by Aryo

Post on 20-Jun-2015

195 views 0 download

Tags:

Transcript of Technical UI in Mobile Games by Aryo

@agatestudio

Technical UI

Aryo

Knight

Agate Studio

Agustinus Arya Adhinugraha

Introduction

Multiple Resolution

Multiple Aspect Ratio

Atlas

Patch 9

Compression

Unity & NGUI

References

Multiple platform & device

Multiple resolution

Multiple aspect ratio

Scale down• Lost image quality

Scale up• Lose performance

SD – HD• Best Approach

• Different image

Virtual Viewport

Anchor

Anchor

Many Textures -> Many Draw Call• Reduce Performance

Non power of two textures• 550x330 -> 1024x1024

• Waste all extra space

Pack all textures into one texture• Single Draw Call -> Increase Rendering Speed

Power of two atlas• Efficient

Stretchable• Without losing quality

9 Parts• 4 Parts Unscaled

• 2 Parts Scaled in Y axis

• 2 Parts Scaled in X axis

• 1 Part Scaled in both axis

PVRTC (iOS)

DXTC (desktop)

ETC (android)

RGBA16 (all)

Unity support texture compression• PVRTC 2bpp/4bpp

• DXT1/5

• ETC 4bpp / etc2 4bpp/8bpp

NGUI• Anchor (top, left, right, bottom)

• Atlas package

• 9 Sliced sprite

• Sprite Fill & Color Tint

http://v-play.net/doc/vplay-different-screen-sizes/

http://blog.gemserk.com/2013/01/22/our-solution-to-handle-multiple-screen-sizes-in-android-part-one/

http://withimagination.imgtec.com/index.php/powervr/pvrtc2-taking-texture-compression-to-a-new-dimension

http://blog.wolfire.com/2010/03/Using-texture-atlases

Thank you!