BA3b - Week 4 Summary

This week I worked mostly on a UI/UX art test that I signed up for by Aiden Lesanto. The task was to 'Design an Inventory/Equipment screen where the player will manage and equip items and view stats about their character/loadout.' 

You could either make design it for your own game idea or recreate another games UI/UX. I decided to design some for my own game idea, a Stardew Valley/Harvest Moon inspired farming game about mice and breads/pastries. The main element of the game is that you would be farming breads or other pastry products instead of normal crops, and you are a mouse. I wanted to focus mainly on the UI and the aesthetics of the designs as that is something I felt more comfortable with; I have never really looked into doing UI and UX before. I was thinking the game I was making would be some sort of 2D/Pixel game on the PC. I started drawing out templates on squared paper. 

Overlay designs, with character and grid system

Inventory system with equipment etc

Talking to a vendor

Buy/Sell inventory system

I wanted to keep the designs fun and engaging whilst still remaining easy to use and accessible. I think that getting my ideas on paper first really helped me get a better feel for the kind of aesthetic I wanted for my game UI.

I then moved on to using Adobe Illustrator to create basic wireframes. Illustrator is a software I had never used before, so it was fun to experiment and learn with it.

Wireframe showing overlay screen

Wireframe showing the inventory with the character and equipment

Wireframe showing how the inventory box appears above the game, 

with all the overlay UI still there

I wanted to keep the design of the wireframes simple so that its easy to understand and isn't too cluttered.

I also created some wireframes showing some of the UX design

Wireframe showing that you can drag the bag to the equippable slot on the right

Wireframe showing the bag equipped above character and also on the character

Wireframe showing that the tool can be dragged and dropped 

into the equipment slots below

Wireframe showing the fork is now equipped, also showing

tool on character as there would be an animation of character holding it

I used the pen tool/vectors a lot for the wireframes, and used images or my own art to get the right shapes. I was pleased with how the wireframes came out, especially as I had never used Illustrator or done UI/UX design before. Graphic design has always been something I have enjoyed, so I had fun making these. 

Below is the art mock-up. I decided to use the wireframe with the tool equipped.

I'm relatively pleased with the mock-up, though much of it was done in a rush due to time constraints so it is not to a level that I am pleased with. I wanted all the elements to be pixel art that I made, but decided that I didn't have enough time so used some of the silhouettes I had drawn previously. I also used a Stardew Valley background to show that the game would still be running in the background. I think that the inventory UI could be a lot better, I think I panicked slightly with the design and decided to make it inspired by a sandwich, with the bread the background and then cheese, pickles and tomatoes. I think if I redid it and/or had more time I would still keep this idea, but maybe refine it more and make it more aesthetically pleasing. The rest of the UI feels very consistent and I'm pleased with that, as the bread theme worked well. Overall, I think I did rush it a great deal at the end so it is no where near the level I want it to be, but I am pleased with what I have achieved in one week. 

Below is the presentation I made, explaining the choices and designs.

Due to the art test, I haven't done as much work as I would have liked on my main project. I did finally try out Sketchup, and created very simple and blocky bunkbed room design to get a feel for the program. I decided to do a bunkbed design because I was thinking about the mouse characters environment, and how it would be a lot smaller than the princes due to money and space.

This is a very basic design, and I was essentially just trying to get to know the program and figuring out how I can work with it for my environment designs. 3D is not something I am very familiar with, so I want to continue working on Sketchup and Maya and get a better understanding of it for my environment designs.

I drew my prince characters head in more detail with my iPad on CSP, as I'm still not sure on how his face should look yet.

I also took into account that my anatomy and face drawing skills, and just humans in general are very lacking, so I decided to do some quick face sketches from models found on pinterest. I also experimented more with my characters faces and hair, and I feel like I am getting closer with the mouse servant characters design. I tried her out with a plait, and the how a plait would look tied up, perhaps over the front of the head. I want her face to be round and cute, with the cat character somewhat contrasting with more sharp angles and an intense beauty.

Model images used below

                                       (x)                                    (x)                                     (x)

                                                           (x)                                    (x)

As well as continuing working in 3D and getting a better understanding of it to start my environments, I want to also try to do anatomy and face studies in order to improve my skills in those areas so that I can feel more comfortable, and happier with my character designs.

BA3b - Week 3 Summary

This week I continued to work on my character designs, starting firstly with the cat prince. I adjusted his pose to feel more realistic by making his legs more spread and slightly more bent, and made his shoulders/upper body straighter. For now I have gone for the domesticated cat in terms of the ears and tail as I want to focus more on the colour schemes and not worry about other elements. 

I started looking at colour schemes for the character, starting with blue and yellow as they felt as if they had a royal and rich appearance, and contrasted well. Blue has often been seen as a royal colour (e.g. royal blue) due to the difficulty and scarcity in finding it as it had originally be mined from lapis lazuli, and the yellow would be associated with gold and richness.

"Blue rarely appears in nature – there are few blue animals, fruits or vegetables [...]. Blue only appeared when the Egyptians started mining and unearthed lapis lazuli, a semi-precious stone first found in Afghanistan about 6,000 years ago. Lapis was scarce and thus greatly prized [...]" (The Guardian)

"[...] the blue pigment remained rare and expensive until the dawn of the industrial age, which probably explains blue’s longstanding association with royalty and divinity, and possibly why it is a widely favored color today." (NY Times)

I started experimenting with other colours, using reference images of various 18th century outfits as inspiration.

I decided that purples and blues felt the most appropriate for a prince, and complimented with gold gave a strong sense of royalty to the outfit. Purple (or Tyrian Purple) is another colour that is associated with royalty, due to again the difficulty in acquiring it. as it is extracted from murex shellfish. 

"According to the historian B. Caseau, "10,000 shellfish would produce 1 gram of dyestuff, and that would only dye the hem of a garment in a deep colour" (Bagnall, 5673). These numbers are supported by the quantity of discarded shells which, at Sidon for example, created a mountain 40 metres high. Such figures also explain why the dye was worth more than its weight in gold." (Ancient History Encyclopedia)

With the blue and purple colour schemes, I experimented with the colourings of the cat elements of the character. I was looking at 'points colourations' in siamese cats, where their faces and paws are darker than the rest of their body. Below are some images of this.

(Lilac-point Siamese)

(Seal-point Siamese)

I felt that these cats, with their interesting colouring, have a royal-esque appearance and would suit the character. The blue colour scheme for the outfit seemed to have worked better with the blue coat for the cat parts, and the purple worked better with the browner ones.

I also researched into the French royals in the 18th Century, wanting to get a better feel for their history and what they would have worn at the time. Louis XIV reigned in the early 18th century, until his death in 1715 which left his son of 5, Louis XV, as king with the duke of Orleans as regent. Louis XV reigned until his death in 1774, where his grandson Louis XVI took over. 

(Louis XIV)

(Louis XIV and his family)

 

(Louis XV)

 

                                        (Louis XV)                                                  (Louis XV)

 (Louis XVI as a child) 

                                                                       (Louis XVI)

All of these portrait paintings show them in outfits that involve in some way the colour blue, and often are adorned with golden embroideries and other elements. There are often also the colours white and red, perhaps to resemble the colours of the French flag.

I also continued to work on the mouse character, looking at her colour schemes.

I was looking at keeping the apron white, or a pale version of the colours of the other elements. I tried out gold at first with the colours I had used with the prince, to compliment the royal outfits, but it seemed to out of place as a bright yellow would not make sense for a cook/servant. Looking at the reference images I've used previously, I took elements from each and tried them separately to see how they would work. The top right two are using stripes with more details and embroideries on the chest area, and the bottom ones are more detailed on the arms/body with stripes on the front. I was also experimenting with a couple of colours with the legs/ears. I was going to try it with more colour and details but found it difficult, so may have to experiment more with that area to get a more mouse-like feeling.

Below are the current ideas for the final concepts of the two characters. I picked blue as the main colours for both, as its a colour that appears in all of the paintings shown above, and worked well with the golds. I added sketchy gold details onto the prince, getting a better feel for where and how jewelry and embroidery would be on the outfit and body. With the mouse character, I was trying to get a better look at what height she would be compared to the prince as she would be a large amount smaller. I may reduce her size further, but this is an estimation of her size. I am pleased with how she compliments the princes outfit but still looks like she is a servant or chef.

Currently I have chosen greys as the may colours for the animal elements of both characters, but I want to work further with those areas. I'm still not sure about if there should be more elements of their animals in their faces and arms, and how the hair should look. I am also not yet set on if the characters will have shoes or other elements on their feet.

I went to HAMILTON on the weekend, a musical about the life of Alexander Hamilton, one of the founding fathers of the United States. When going it didn't cross my mind that it would be relevant to my work, but due to it being set in the 18th century the fashion was similar to what I have been looking at, although being in the US. I decided to look up the costumes of the musical, and found a Q&A and sketches from the costume designer Paul Tazewell at the website Tyranny of Style.

Paul Tazewell -“[...] Because HAMILTON is about an actual and year specific period of time that is very well known, it was important to decide if it would be a filmic recreation of the American Revolution/Colonial Period or if we would do the opposite and have the contemporary sound and telling of the story require me to design with a more modern style, as in contemporary fashion and street clothing. With that question on the table I collected an expansive array of images/research of 18th century clothing appropriate for the characters in this story as well as many of the portraits that were painted of the forefathers and surrounding people involved in the founding of our country. At the same time I was pulling together the same amount of contemporary fashion images that might have a style influence inspired by the 18th century while maintaining a very contemporary feel and silhouette. So we were weighing both directions, or a mix of the two.

Below are sketches and images from the mens costume designs in HAMILTON -

 HAMILTON, Jefferson, King George, and Ensemble

HAMILTON costume sketch

                                                                                                                        

 Jefferson costume sketch

Jefferson and Ensemble

  Aaron Burr

                                                            Aaron Burr costume sketch

King George

                                               HAMILTON, Lafayette, Mulligan, Laurens

Paul Tazewell: “King George is as close a direct copy of a portrait of King George as I could get. I chose a portrait that was of him in red to align him with the 'redcoats' of the British military. He is the representation of the old world, unchanging and set in stone as weighed down by a jewel encrusted crown and ermine cape. He also carries the foppish quality that was so prevalent in men's clothing of the 18th century aristocracy.”
Below are some of the womens costumes -

Peggy Schuyler costume sketch

                                                          Eliza Schuyler costume sketch

                                                        Peggy Schuyler costume sketch

                                                                      Schuyler Sisters

I definitely loved the play a great deal, and want to take inspiration from the costume designs in my own practice.

I also went to a careers meeting with Sebastian, where in groups we talked about what we wanted to do after we graduate. I talked about how, even though freelancing is something I would like to do in the future, I think getting a job in a studio would be the best option for me both physically and mentally. If I started freelancing, it would probably start with me being at home, somewhere I would easily get comfortable with and get too relaxed, which might stop me from advancing in my career. As we are tucked in the countryside it also makes it difficult for me to do things as there is not much around, and money and transport is often needed to get around outside of the town. Studios would mean I'm getting out every day, meeting people and give me that social space to work in and feel valued.