Dec 202011

WebGL (Web-based Graphics Library) is software library that allows for 3D graphics to be displayed in a browser. The library allows supported browsers to render polygon based models in real time. It was created by the Mozilla Foundation and has opened a new realm of possibilities for web graphics.

In terms of League of Legends skin viewers it means that champion models can be rendered in real time and inspected from any angle. The images below link to a couple of skin viewers that make use of WebGL to show skins with the highest detail possible.

League of Legends Skin Viewer

League of Legends Skin Viewer shows all skins from any champion next to one another. The models can be rotated around the vertical axis while the arrow keys move between skins. The display permits easy comparison among skins and fast navigation between champions.

League of Legends WebGL Skin Viewer

Gamebase’s League of Legends Skin Viewer

Gamebase has updated its skin viewer to use WebGL. The previous flash based viewer is still available but is much slower in comparison. Each champion can be selected from the left side menu. The menu allows custom filters and already includes filters based on role.

The splash arts under each rendered skin link to each skin’s model. The last option allows for a skin’s texture to be applied to any champion’s model. The models can be rotated along both the vertical and horizontal axes, can be zoomed in and out with the mouse wheel and moved with the right button. There’s even a GUI available to make all options easily accessible.

League of Legends Gamebase's Skin Viewer

WebGL is a great quality improvement for skin viewers. Champions’ models and skins can be easily compared and inspected. It’s great news for modelers to use as examples and for skin fans to get the most from their purchases.

  2 Responses to “League of Legends WebGL Skin Viewers”

  1. Here is another one that you can add to the list:

 Leave a Reply

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>



This site uses Akismet to reduce spam. Learn how your comment data is processed.