. Coherent Labs

Gameface 1.0 released!

RELEASES

7/12/2018

Dimitar Trendafilov

The last step to complete our rebrand is to release the new versions of Coherent Gameface and Coherent Prysm and it’s nigh time we delivered those. Let me tell you all about them.

Coherent Gameface, as you’ve probably seen elsewhere is the game UI solution for developers with love for the web stack. HTML5 is a great technology and by using it you benefit from the massive community, talent pool and existing libraries for HTML and JavaScript. Not to mention that frontend developers can work separated from the core gameplay engineers. To learn more about Coherent Gameface, visit its page or check its features.

Starting with the more exciting news – compared to Hummingbird 1.14, Coherent Gameface 1.0 comes with a bunch of new things.


Custom elements

Custom elements are a relatively new addition to the HTML standard which allows for the creation of…well, custom elements! Custom elements allow you create customizable and reusable component-like classes that can then be composed to create the final UI. Read more about them on MDN. Syntax as easy as 1-2-3:


<-- Define the custom element -->
<script>
class HealthBar extends HTMLElement {
	….
}
// Tell Coherent Gameface what tag to use for it
customElements.define('health-bar', HealthBar );
</script>


<-- Use it as you would any other element -->
<health-bar percentage="50%">
</health-bar>

Virtual lists

Virtual lists are a brand new feature to Coherent Gameface which solves one specific problem we’ve seen people encounter time and again with our data binding system. Whenever you bind some list of items, it’s often that you need to display only a part of it. That ‘part of it’ usually falls into one of these categories:

  • Pagination – display some fixed number of items and potentially allow the user to go to the following items (e.g. display 5 weapons at a time in an inventory)
  • Filtering – display all items that match some predicate (e.g. show all unlocked weapons)
  • Sorting – display all items in some order

This release will simplify the pagination part but we’ll also add the 2 others in one of next year’s releases. So for example:


<script>
let inventoryList = engine.createVirtualList();
// Display items 0 to 5
inventoryList.startIndex = 0;
inventoryList.pageSize = 5;
</script>
<div data-bind-for="weapon: inventoryList({{player.inventory}})">
	<!-- Item -->
</div>

This allows you control how many and which elements are visible in a simple manner.
See the docs for further info about usage information.

Support for UWP ARM

UWP has been part of our supported platforms for the better part of this year but we were missing ARM as an architecture and this release closes the last gap. You can now run Coherent Gameface on mobile devices with Windows as well as PC and Xbox One.

Migrating from Hummingbird

For everyone upgrading from Hummingbird to Coherent Gameface, the steps needed to update are rather simple and available in a document your favorite support team will share separately. Do contact them at support@coherent-labs.com to get access to it.

Tell us your thoughts!

For a full list of changes, as always you can check the changelog and hit us on twitter or anywhere else to tell us what you think. I am also very curious about your thoughts on our new style. We’ve put a lot of effort in the rebrand and we are pretty happy with how it went but it end it’s your opinion that matters the most.



Enjoy your New Year’s Eve and stay tuned for Gameface 1.1 coming out in January!


Credits for the above video go to CyberWebFX