DYNAMIC UI

SCALABLE UI SYSTEM

This is a post that I would keep updating the dynamic UI I created
Aiming to create scalable system for wide range of interactions
‍KEYWORDS
VR; AR; Pipeline; Content Creation; User Interface; Interaction; Experience Design; UI; Game; Product Design; User Experience; Game Development; Visual Design
‍
Yiqi Zhao

‍

Slider and Data

StringBuilder builder = new StringBuilder(); infoText.text = builder.ToString();

Get all text contents in a new string to display, and add Append

slider1.GetComponent<Slider>().value = item.(the data we need from item);

Parse data from items into 0 - 1 slider value

‍

Cursor follow

 float (xxxx) EdgeToScreenEdgeDistance: calculate the from (left top right bottom) to cursor distance 

private void FollowCursor()

public void DisplayInfo(Item item)

public void HideInfo()

‍

Color from Rarity

Get the color palate we want from rarity setup and modify the icon sprite’s color or text color accordingly 

 if (ColorUtility.TryParseHtmlString("here goes hex of item's color", out mycolor))

‍

ALL IN ONE PROGRESSBAR

Outline:

  • Base
  • Alpha 1
  • Alpha 2

The progress bar is made with a single shader that takes a base sprite and an alpha sprite. The  alpha is a gradient mask to calculate the percentage of opacity of the above layer on the base layer. The shader is designed so any irregular shape base could have same performance.

TBD...

Yiqi, designer, technologist, artist.

about me
contact me
⇑ TOPBACK TO WORKS


Have a good day !
HOME
Contacts
Redmond, WA, USA
vanyiqi@gmail.com
yanyan77sukidayo
Follow
/Long dream stretches, because of you.
Copyright © 2021 Yiqi Zhao. All rights reserved. 0_0