Mobile app version of vmapp.org
Login or Join
Gonzalez368

: Best way to show transition between states I need to graphically represent transition between different states. The states list is dynamic. At one time only one state can be active. We have

@Gonzalez368

Posted in: #InterfaceDesign

I need to graphically represent transition between different states. The states list is dynamic. At one time only one state can be active. We have a product which gives the user ability to define manufacturing cycle.

For example One user may define the cycle as Design->Engineering->Manufacturing->Sales. Other user may define as Product Design->Product Engineering->Process Engineering->Manufacturing->Sales and Service.

We need to graphically represent the cycle created by user and also present that in which stage is it currently. For example if it is in Product engineering then we need to highlight it. Please suggest if any good examples are available for reference

For example presenting this cycle to user after he has created one (the one below is not accepted by the management), stating that its not a very good way to represent. They want some better way to represent the same. They are looking for attractive UI with nice colors. This rectangular shape was not taken well

10.01% popularity Vote Up Vote Down


Login to follow query

More posts by @Gonzalez368

1 Comments

Sorted by latest first Latest Oldest Best

 

@Jessie844

I am not sure if you are asking just graphics examples or a system to do that interactive.

If you just need some inspiration you can watch some videos about "motion graphics" www.youtube.com/results?search_query=motion+graphics or "motion design" www.youtube.com/results?search_query=motion+design
If the output format is a video the tool can be after effects, or a simmilar program, or an open source program like blender.

If you need interactivity probably the best bet is to use html5+Css3+JavaScript and probably a server side languaje, probably a database.

A JavaScript library that is well known is raphaeljs.com/ you can see demos of interactive graphics there.

Or Css3 animations if you does not need a lot of interactivity. www.google.com.mx/search?q=css+3+animations
Or a simple slide show. www.google.com.mx/search?q=fade%20slider

10% popularity Vote Up Vote Down


Back to top | Use Dark Theme