TOORNAMENT

CLIENT

Oxent SAS

Paris, France

ROLES

UI/UX Designer

PLATFORM

iOS + Android

TV

ESPORT PRIME TIME

 

Toornament is the next generation esport platform. Covering all the crucial needs for professional tournament organizers, Toornament adapts to games, and supports all types of tournament formats – simple or complex – with embeddable, multi-content widgets.

[unex_ce_button id="column_content_fm8tu98vd" button_text_color="#ea3333" button_font="custom_one" button_font_size="18px" button_width="auto" button_alignment="center" button_text_spacing="2px" button_bg_color="transparent" button_padding="15px 60px 15px 60px" button_border_width="3px" button_border_color="#ea3333" button_border_radius="100px" button_text_hover_color="#922f2f" button_text_spacing_hover="2px" button_bg_hover_color="transparent" button_border_hover_color="#922f2f" button_link="https://itunes.apple.com/fr/app/toornament/id974719460?l=en&mt=8" button_link_type="url" button_link_target="_blank" has_container="" in_column="1"]DOWNLOAD ON THE APP STORE[/ce_button]
[unex_ce_button id="column_content_xqks4q5hb" button_text_color="#ea3333" button_font="custom_one" button_font_size="18px" button_width="auto" button_alignment="center" button_text_spacing="2px" button_bg_color="transparent" button_padding="15px 67px 15px 67px" button_border_width="3px" button_border_color="#ea3333" button_border_radius="100px" button_text_hover_color="#922f2f" button_text_spacing_hover="2px" button_bg_hover_color="transparent" button_border_hover_color="#922f2f" button_link="https://play.google.com/store/apps/details?id=com.oxent.toornamentapp" button_link_type="url" button_link_target="_blank" has_container="" in_column="1"]DOWNLOAD ON GOOGLE PLAY[/ce_button]

Turning Toornament's widget to a fully featured and usable mobile interface was undoubtedly a challenge. Many constraints and goals had to be kept in mind throughout the whole conception phase.
Like most projects, it all started with some "quick and dirty" paper and pencil sketches, here is a preview of some of them.

toornament_content_sketchestoornament_content_sketches

Once all the key features and the app navigation were locked and validated on paper, I started the visual and UI design production.

Toornament already has a brand of its own along with a running website and widget, so it was clear that I had to keep this mind when designing the mobile app. As a result, simplicity and legibility were mandatory in this mobile MVP, intended to be a fully featured mobile tool rather than a mere companion.

Toornament TV is a smart, automated public display solution that was tailor made for offline tournaments involving multiple competition events and stages, with a public audience.
The initial brief I was given mentioned two key features I needed to integrate in my design:

• Its whole UI has to be customizable. Sponsors, teams, backgrounds, game logo must be easily changed.

• Its unique HD size and all the data to display must be fully readable on small TV screen as well as a huge big event screen. 

toornament_content_tv_displaytoornament_content_tv_display

ELECTRONIC SPORTS WORLD CUP

The ESWC is the largest global and multi-gaming competition, and also an iconic brand that has been running for 12 years around the globe, from San Jose to Paris.

Toornament TV was successfully used for the very first time in ESWC 2014 Paris Games Week event, where thousands of spectators and hundred of competitors relied on those big screens to follow on-site competitions live feed.

[unex_ce_button id="content_sdm6tff83,column_content_fm8tu98vd" button_text_color="#ea3333" button_font="custom_one" button_font_size="18px" button_width="auto" button_alignment="center" button_text_spacing="2px" button_bg_color="transparent" button_padding="15px 60px 15px 60px" button_border_width="3px" button_border_color="#ea3333" button_border_radius="100px" button_text_hover_color="#922f2f" button_text_spacing_hover="2px" button_bg_hover_color="transparent" button_border_hover_color="#922f2f" button_link="mailto:contact@julienmartin.me" button_link_type="url" button_link_target="_blank" has_container="" in_column="1"]CONTACT ME[/ce_button]
[unex_ce_button id="content_sdm6tff83,column_content_xqks4q5hb" button_text_color="#ea3333" button_font="custom_one" button_font_size="18px" button_width="auto" button_alignment="center" button_text_spacing="2px" button_bg_color="transparent" button_padding="15px 73px 15px 73px" button_border_width="3px" button_border_color="#ea3333" button_border_radius="100px" button_text_hover_color="#922f2f" button_text_spacing_hover="2px" button_bg_hover_color="transparent" button_border_hover_color="#922f2f" button_link="http://www.julienmartin.me/about" button_link_type="url" button_link_target="_self" has_container="" in_column="1"]ABOUT ME[/ce_button]

© 2016 • Julien Martin