Jenny Peers writes about her work on Fable Anniversary

Jenny Peers recently wrote a blog post detailing the work she has been doing on Fable Anniversary edition. Really interesting to get some insight into what she has been up to.

The original post can be found here: http://www.lionhead.com/blog/2013/november/12/fable-anniversary-ui-old-and-new/

Hello!  My name is Jenny Peers and I am the User Interface (UI) Artist on Fable Anniversary. I have been at Lionhead for nearly 2 years and 3 months now, and love my job here!  Before I started here, I was studying Computer Games Design BA (Hons) at the University of Wales in Newport while working as a freelance artist and web designer in my spare time.  My passion for games started when I was around 8, having seen and played on a friend’s games console. This spurred me to want a career in the games industry.

UI Blog - Jenny Peers

I first came across Fable while in my late teens, and I absolutely adored every minute of it.  From that point onwards it was my dream to work on a Fable game. I am over the moon to have been given the opportunity to work on Fable Anniversary!  Enough about me, now back to work!

So what is a UI artist?  UI stands for User Interface. This can include in-game menus, heads up display (HUD), icon design and even creating Xbox 360 Dashboard themes.  I have to find functional and attractive ways of displaying key information to the player while they are playing the game.

Press Start:

UI Blog - Pressstartorig

UI Blog - Pressstartnew
One of the first screens players are greeted with in Fable Anniversary is the Press Start screen.  I have made 4 versions of this screen which are randomly displayed each time you load the game.  The key thing I wanted to do with these screens was to make them interesting and showcase a range of different environments you can explore in the world of Albion.

Frontend and Pause Menu:

UI Blog - Paused ORIGUI Blog - Frontend
Once you have pressed start, you are taken to the frontend menu which takes the shape of a book.  While designing what the frontend should look like with lead designer Ted Timmins, we went through a number of different layouts and ideas.  When we sat down to review all the concepts we noticed there were a few things that were still not quite working. Ted randomly commented “Can it be a book?” and the more we thought about it, the more it made sense.  Each player is starting their own story as a new hero, as they progress through the game every action is being documented and their own story book is made.

UI Blog - Paused NEW

I created a new set of concept images and worked on the visual design of this Fable book. This has also inspired the design of our strategy guide.  The book theme is used for both the frontend and the pause menu, and strengthens the paper theme which runs through the Inventory as well as other HUD features.  It makes use of simple navigation to enable the player to quickly start or continue a game, manage their saves (all 18 of them!), and make a new hero as well as featuring a special achievements page!  (There will be more information on the achievements soon!)

HUD:

UI Blog - HUD ORIGUI Blog - HUD NEW

Being the UI element that’s viewed most, the first task I gave myself was to tackle the HUD.  I wanted to design something that remained familiar to players who have played the original game while still creating a fresh and refined UI.  The visual treatment I decided on uses golden framed elements to help celebrate Fable Anniversary and give a bit of elegance.  The HUD uses over 400 unique icons for displaying objects including items, characters and spells.  I recreated all icons as vector shapes which has allowed them to be resized quickly and easily for multiple uses.  The Mini Maps have been restyled to have a more hand drawn look and the map container can be easily resized or completely hidden for the more advanced player.  As you play the game, elements of the HUD fade in and out as and when they are needed, minimising the amount of information on screen at any one time.  Players also have complete control over the HUD opacity. If you want to raise the difficulty of your game, try setting it to 0%!!!

UI Blog - HUD Minimal NEW

Inventory:

UI Blog - Clothingsuitsorig
The inventory screen was one of the biggest changes to the UI.  The original game had many levels of options which you had to go back and forth through to find what you were after. I have tried to simplify it by creating a new layout which allows for quicker navigation.  The Xbox 360 Controllers trigger and bumper buttons control which section you are viewing and their sub-sections.

UI Blog - Clothingsuitsnew

The two thumb sticks and D-pad are put in control of filtering the content and reading item descriptions.  Using this new layout players can quickly flick from choosing their equipment to reading about their current quest with minimal button presses.

Quest Complete:

UI Blog - Questcomplete ORIGUI Blog - Questcomplete NEW
The Quest Start and Quest Completed screen follows the paper visual style by presenting you with an actual quest card.  The card presents a summary for the active quest on its front side, it can then be flipped to show a more in-depth breakdown on its reverse side.  When you have completed a quest successfully, all rewards gained are listed and the card is given a Guild stamp of approval!

Region and World Map:

UI Blog - Worldmap1origUI Blog - Worldmap1new

The Region Map screen now has more space to show the map and text for each location, making it easier to see region information at a glance such as which shops a town has or if any houses are for sale.  Players can also filter the location list so only regions that have active quests are displayed.  The world map itself has had a big visual style update (secret password “52 chickens”) so it looks more hand drawn and compliments the updated mini maps.  I referred to the original Albion map heavily and was keen to try and keep a familiarity between the old and new. By keeping the colours similar I hope that, at a glance, players still recognise it as the iconic Albion map.  A new full screen world map view has been added, allowing players to zoom in and pan around to explore every fine detail as well as utilising it for loading screens.  It was important to me that the map should become more of a feature, animations and a few hidden surprises have been added for the keen eyed adventurer…

Discuss this on our forums!

The original post can be found here: http://www.lionhead.com/blog/2013/november/12/fable-anniversary-ui-old-and-new/

Advertisements

Two Newport Student Teams Short-listed for the Crytek Off the Map Competition

Off The Map is a year-long project that encouraged students to create interactive environments using the CRYENGINE games engine. The competition supported by Crytek the British Library and GameCity, challenged students from selected universities to draw inspiration from British Library maps and then turn that inspiration into games. Teams could choose from three different maps: The Pyramids of Giza, Wiltshire’s Stonehenge, or London around the time of the Great Fire in 1666.

The competition short-list comprised of three teams, two of which were teams from the University of South Wales’ Computer Games Design Course. As finalists they had the opportunity to visit Crytek’s studios in Nottingham for feedback about their games and to gain an insight into the companies production processes. The teams were then asked to showcase their games at the Nottingham GameCity festival to an invited audience of professional games developers.

Ian McMichael presented his team’s work entitled ‘Mystical Wings’, a fantasy world based upon Stonehenge where the player controls Liliana a 6″ tall faery.
http://www.crydev.net/project_db.php?action=project_profile&team_id=5306&project_id=5200

James Macleod and Max Cutler then presented ‘Catacombs’ a game which takes the player on a journey through a fantasy landscape of underground dungeons and caves hidden beneath Stonehenge.
http://www.crydev.net/project_db.php?action=project_profile&team_id=5375&project_id=5208

Computer Games Design Lecturer Adam Martin says: “The student’s professionalism during the event was excellent, they did a fantastic job of conveying a sense of the games they had created and described the technical details of their production, they impressed the seasoned games developers at Crytek. We are very proud of what they have done.”

We are now preparing for next year’s competition and see this as a great way to enable students to engage with industry in a meaningful and valuable way. The ethos of the course is to make great games, so when competitions like this arise we can integrate them as assessable coursework. We actively encourage our students to work on projects that combine academic rigour and technical expertise, both of which are highly valued by the industry partners involved with the Off The Map project.