Jam City's Vineyard Valley
Role: Lead UI/UX Designer
Time: One and a half years (2020-2021)
Vineyard Valley is a collapse puzzle game with a mansion decoration meta wrapper. The game is still running, but has since been handed off to a different studio.
My Role and Growth
I took over the role as Lead UI/UX on the team. This was my first time have any direct reports. I lucked out and managed to work with a great team of UX designers. I took a lot of my learnings and growth from Panda Pop and applied them here. By the end of my time on the team, the UX team had a tight pipeline from start to finish and started new documentation trends at the Jam City SF office for different UX teams. 

While I continued to do a lot of IC work, the part of this team that I felt was most important was the infrastructure I stood up as the UX lead. 
UI Exploration that was used in CI Testing
UI Exploration that was used in CI Testing
UI Revision for the Event HUB
UI Revision for the Event HUB
Select Mode UI
Select Mode UI
UI Mock up for Daily Rewards
UI Mock up for Daily Rewards
Some of the UI Screens that I worked on
My Goals
While on the Vineyard Valley team I  had my own set of internal goals for the User Experience team.  

• To create a hub where people could easily find UX documents, UI style guide information, implementation info, etc.

•To work closely with the other teams to help UX be more integrated into the process rather than being a set of hands. 

•To grow the skills of the other UX designer by giving them tools to succeed. 
Creating an Informational Hub and Design Systems
While the project was already live when I joined the team, up until that point there had been very little processes on the team. There were only two UX designers at the time and much of the information was passed directly between the two. This meant that there was no insight from other team into the UX team's process or documentation, nor was it easy to find old documentation that could be relevant. 

There were also no UX Pillars to refer back to and make sure our designs continued to be aligned with the Game Pillars. In order to fix these issues I created a Confluence page to house all the UX Documentation. This included general informational docs, systematic documentation, feature specific, etc.

I wrote Design Pillars, Typographic rules, Prefab lists, etc. I also made sure that we had some Design systems in place things for features that could be grouped, such as Events. 

 
Take Away
Overall this endeavor saved us many hours and made it much easier for QA, animation, etc. to find what they needed from us without needing to ping us directly. For the Post Mortem for the Vineyard Valley SF team, the UX team was called out as being the best team to work with. 

Since then, many of these specific documents and practices have been pulled into other teams in the SF Studio. 
Snippets of some of the Information on the Vineyard Valley UX/UI Confluence page
Snippet of a document I wrote to onboard UI  Artists to adding images into Unity. This document is now used on several teams
Snippet of a Systems Document that I wrote to house all our Events. Each event added would be assigned a size by design and then the correct flows would be applied. This prevented one-off Event issues. 
Working with Other Teams
The Issue: Game Design would finish a design with rudimentary UX that would get approved by Stakeholders. UX would come in later and cause churn because UX issues would arise that hadn't been caught in Pre-Production. 

The Solution: UX and Design would create one document instead of two and UX would be looped in during the 1-pager step. This allowed UX time to focus more on creating cohesive UX and gave us a sense of ownership over the direction.

Take Away
Unifying the document was also extremely helpful for QA, Engineering, and Production because we would have only one source of truth that needed updating rather than competing documents. In all future teams I want to make sure that UX has the relationship with other teams that they did on Vineyard Valley.
A few snapshots of the Select Mode Design/UX Document
Prototyping 
We also worked closely with the Consumer Insights team. The other UX designer and myself would create prototypes for the Consumer Insights team to use in their testing. 

These could range from a series of slides in a Google Slides up to a complex Protopie that included many variables to get it as close as possible to what a real experience would be. It depended on the ROI and timeframe. 

You can check out the prototype for our FTUE here. For this prototype we wanted to check how the story felt, if the steps were clear, and if the pacing was too fast or slow. Due to all of that, there was a lot of variables needed. 
Short video of the FTUE Prototype that was used in testing
Short video of the Select Mode UX that was used to show Animation and Engineering how we wanted the feature to work
Overall Takeaways
Vineyard Valley was a great team to work on. I learned a lot about leadership and creating a good working relationship with other disciplines. Due to our consistent and trusted UX work the team was able to move quickly and create a level of pixel perfection that wasn't there before.

The UX Designer that worked with me has grown tremendously as a designer and that felt like the biggest win. 


Back to Top