WEEK 9 - 26th April
Scene Mockups/Testing, Final Asset Creation
Monday 26th April
Today I plan to begin the creation of butterfly variations. Before doing so I must take into consideration the colour schemes of the environment and Kieras new background concept.
WORK DUE THIS WEEK
Final assets including butterflies and new trees.
Test new butterflies before choosing final.
New scene mockup with new assets.
​
​
TO DO LIST
-
Create a new variation of butterflies to suit environment - take step away from using blue tones, use more vibrant colours.
-
Send through all of my finalised Assets on Slack, also attach these to the 'Assets & Comments' Google Docs where we store all of our final assets ready for implementation in Unity.
​
Monday 26th April
Kieras new backgrounds and Charisma's new iteration of Clouds
EVALUATION AND FEEDBACK
​
Kieras new background is great and works well with our assets! The colours used are those established in the art bible and contrast well against the scheme of our other assets. The sunset scene gives the environment a more homely and comforting feel rather than it being during the day. We can now test this in another scene mockup against the remaining asset designs.
Charisma created 4 cloud iterations depending on the position of the sun which we will experiment with also. Next stages of scene testing will be extending the scene and implementing the puzzle interactions into it which will include the tree restoration, panpipes, eagle, lanterns and more. To do this correctly, I will refer to the gameplay structure at all times.
​
To assist my scene mockups Charisma has kindly offered to do some of her own testing in photoshop and using new draft assets to create depth in the environment.
​
NEXT STEPS
​
Extended scene test, include depth and work with Charisma on this. Continuing with asset creation and aim to have them sent in by the end of this week.
​
​
UPDATED ASSET LIST / QA TESTING
MY TASK - Monday 26th April
Butterfly Variations
ASSET CREATION - REQUIREMENTS
​
The next variation of butterflies I make must harmonise with Kiera's background concept. In order to do this I will mockup a test scene and converse with the team to discuss which one worked best! At a later date I will be animating this butterfly and integrating this into the scene in Unity.
​
COLOURS USED -
​
To harmonise the colours of the butterfly with the environment I must use shades (monochromatic palette seen below) of reds and hues of oranges/yellows. To create the ideal colour palette I will use the 'colour picker tool' in Adobe Illustrator to use the correct values from my previous scene mockup.
Short Video Timelapse of process
PROCESS
On the left as you can see I have taken the ideal colour palette for the butterflies and taken note of the colour values to use in my next variation of butterflies.
​
I then began painting the butterflies using a series of brush strokes to achieve a realistic effect. I created the basic outline/structure of the butterfly on another layer allowing me to reuse this and only have to paint the main body in different shades.
​
To paint the main body of the butterfly, I used the same process and approach as my last design. I chose two shades for the main body and essentially the first layer, and gradually added more detail as I progressed. I used the darker shades from my palette to create more shade within the indentations of the wings, and lighter shades to add highlight.
​
SOFTWARE: Adobe Illustration
BRUSH TYPE: Selection
​
For one of my concepts I took inspiration from the Japanese flag. In reference to Josh's GDD, Anima Mundi is heavily influenced by the Japanese theme so I thought I'd represent this in a fun and playful way alongside other Japanese architecture and cherry blossom trees. However I will not know if this works in the environment until testing.
FINAL OUTCOMES
OUTCOME
I love the outcome of each butterfly however If i were to choose before testing I'd say one of the red variations. Taking consideration the colour scheme of the existing environment, these appear as if they would work best.
TEST 6
Testing the appearance of the new butterflies in a screen mockup, using Kieras new background.
PURPOSE OF TEST
​
The purpose of this small test was to test the quality of the butterflies against other assets. Also, this allowed me to come to a conclusion based on which one to animate and duplicate in Unity.
​
EVALUATION OF TEST
​
This scene test lead to my decision in regards to which butterfly to animate. The main focus of Anima Mundi is the beauty in the environment and taking players on a journey of enlightenment and self-discovery. As Josh stated in his GDD, the presence of spirit/guardian animals are important in the environment. Butterflies also have meaning - "a metaphor representing spiritual rebirth, transformation, change, hope and life". The use of butterflies in the environment will symbolise this and add to the attraction of Anima Mundi.
​
I have chosen to go forward with animating the butterfly consisting of both orange and red tones as the colours correspond to those within the sunset and contrast with the platform islands. Overall they tie in all the assets really well and will eventually add movement to our vertical slice.
​
IDEA - to have the butterflies hover over the player and move as they progress. This links to Josh's idea of being led by a Spirit Guardian.
​
NEXT STEP
​
I will take asset creation forward by focusing on animating my design in Photoshop. I aim to have this completed by the 29th/30th April.
​
In order to check off this completed Asset I must animate it first and check this off our Asset list.
27th April - SCENE TESTING
​
Today I will be putting final assets into an extended scene mockup. Charisma will be working on this too so we have a range of combinations and compositions to choose from.
​
CHARISMAS TESTING: (TEST 7)
PURPOSE OF TEST
​
Charisma has experimented using new and existing assets to form depth in the environment. This involved experimenting with composition and lowering the opacity of some assets. For example the mockup presents how the huts may be better placed in the background rather than the foreground.
EVALUATION OF TEST
​
At first glance the assets used to create depth really bring the environment together and distracts the fact that it's a 2D game. However I think lighting will have to be adjusted in order to take effect of the lanterns. Charisma experimented with making the scene darker by testing a dark overlay however this darkened the vibrance of the other assets and I don't believe this would look great in the vertical slice.
​
The addition of mountains and clouds in the backgrounds were a fantastic addition and we have agreed to implement these into the vertical slice. Lastly to keep the feel of the light and airy 'Sky Region' It would be best to reduce the number of clouds in the distance and reveal more of the sky.
​
CHANGES
​
I will take Charismas new assets and adapt this scene to appear as we initially imagined and using Kieras background. In order to do so I have asked for Charismas assets in the form of PNG's so I can quickly build this. I also think it's necessary to work on the colour palette for the Japanese Huts as I feel the scheme doesn't quite work with our combination of work.
​
NEXT STEP
​
-
Next variation of Japanese Huts and other Japanese Architecture
-
Use additional assets to build another scene mockup
​
UPDATED QA TESTING
https://docs.google.com/document/d/1Cd_8L4Rqjv_GIfXImfcc5z_L_0qhrX2SvdA2nMsoRFs/edit?usp=sharing
UPDATED ASSET LIST/MARKING COMPLETION
(These are accessible to the team and always shared via Slack once updated)
https://docs.google.com/document/d/1w07y71xNHjl7GFcYKodi4pgAAp3s-mzV05Y0VSCCuks/edit?usp=sharing
MY TASK - Tuesday 26th April
Japanese Architecture development
ASSET CREATION - REQUIREMENTS
​
Before I create another mockup I am responsible for making the necessary changes to previous assets as well as making additional assets for the background. To fully engage with the Japanese theme I will be using my Japanese themed research to inspire this. Firstly I will be starting with adapting my previous Hut designs.
​
COLOURS USED -
​
To adapt my red Japanese hut designs I have chosen to correspond the palette with the platform islands and trees. This way I can guarantee they'll correspond with other assets in the scene already. I used the 'colour dropper tool' in Adobe Illustrator to use the same palette from the trees as seen below.
PROCESS
My process began with the original Hut design and using different colour combinations to create a final design.
​
I have used a monochromatic palette of the brown used in both the platform and tree designs. Once in the environment this variation should correspond much better with the other assets and overall be much more appealing than my previous design. To achieve similar details as my first design, I made sure to emphasise parts of the temple with darker shades to create a three-dimensional effect.
​
OUTCOME
​
I definitely prefer the outcome of this variation to the red as it reflects the same qualities as traditional Japanese architecture for example their use of wood and natural resources. (The brown represents this) By using this colour palette I can guarantee this variation will work better against other assets.
​
However, I have written down a suggestion to reduce the opacity of the huts to make them seem less harsh once in the environment because I think this would be more appealing. I will test this in my next mockup.
NEXT
I will implement these into the next mockup with my additional assets and experiment with reducing opacity to decrease the harshness.
ASSET CREATION - REQUIREMENTS
​
Next set of asset creation will be variations of Japanese architecture, specifically looking at 'Shinto Shrines' and 'Torii Gates'.
​
COLOURS USED -
​
During the creation of these assets I used the same red tones from the existing architecture in the environment already such as the Bridge. I also used a Pinterest board containing a selection of Torii Gates to use as inspiration and reference for when I begin drawing my concepts.​​
PROCESS
SOFTWARE: Adobe Illustrator
​
I began by drawing 5 concept Torii Gates using the relevant colour scheme and board to inspire their appearance. Molly is working on adjusting lighting in the environment so this wasn't something I needed to take into consideration although I experimented using gradients to make the gates appear three dimensional. I used the shape tool in Illustrator to modify shapes and achieve the structure of the Torii Gate - similar to my process for the huts. I then coloured these shapes appropriately and adjusted their shape by using the 'Anchor Tool'. I experimented with little details as seen in the inspiration board, such as little lanterns and grey detailing. I like the outcome of these Torii Gates and I feel a great idea would be to use one to both begin and complete the game. Almost like a checkpoint.
NEXT
I will test the placement of these Torii Gates within a scene mockup and evaluate the outcome of this.
I will also be forwarding my next set of assets to the team via our Slack channel to gather feedback and comments.
RECOMMENDATIONS/
COMMENTS
Kiera recommends testing the new hut designs in the background of the environment as well as foreground. Kiera also agrees the brown huts are much better than the red.
27th April
TEST 8
​
Testing placement of new assets in scene mockup.
Torii Gates and Japanese Huts:
PURPOSE OF TEST
The purpose for conducting this test was to experiment with the placement and design of both the torii gates and new variation of huts. I will evaluate them against the requirements of the art bible.
EVALUATION OF TEST / ISSUES THAT AROSE
Torii gates work well in the environment and the colour palette works well with existing assets. Issue with the appearance of the Torii gates involve them looking flat underneath and not comfortably standing on top of the platform islands - they are blatantly layered on top. Additionally the huts have resulted in the same problem. The new variation of huts works better in the environment than my previous design however still appear a little out of place. A way to overcome this is to use Kieras suggestion of implementing them into the background instead. Lighting will also be worked on by Molly to create shadows and more movement within the environment.
​
CHANGES / WAYS TO OVERCOME THIS ISSUE
​
The designs themselves do not need to be changed however the composition and structure of the scene must be considered with extreme attention to detail. I will perform another scene mockup using all finalised assets and altering the placement of assets to tie everything together. Our intentions are for the scene to have a homely and relaxing feel, therefore doing this is important - nothing should feel out of place, everything must be placed with purpose.
​
NEXT STEP
​
-
Scene mockup with final assets and implementing idea of depth using new assets.
-
Update Asset List and QA testing.
​
UPDATED QA TESTING
https://docs.google.com/document/d/1Cd_8L4Rqjv_GIfXImfcc5z_L_0qhrX2SvdA2nMsoRFs/edit?usp=sharing
UPDATED ASSET LIST/MARKING COMPLETION
(These are accessible to the team and always shared via Slack once updated)
https://docs.google.com/document/d/1w07y71xNHjl7GFcYKodi4pgAAp3s-mzV05Y0VSCCuks/edit?usp=sharing
LIST OF ASSETS READY FOR EXTENDED SCENE TESTING
What is ready to include -
​
Background
Platform Islands
Shaman/Staff
Blossom Trees
Japanese Huts
Bridge
Lantern
Restored tree
Raincloud
Panpipes
​
​
These assets are ready to be implemented into the next scene mockup.
If successful these assets can be integrated into Unity.
​
​
WHAT NEEDS TO BE DONE?
​
In terms of assets we have a few left to complete -
​
Final Environment Clouds - Charisma (experimenting with light)
Eagle Animations - Molly
Windmill Animation - Daniella
Butterfly Animation - Emilia
​
​
TEST 9 - Tuesday 27th April
​
Extended mockup, using most of the assets in one scene - experimenting with depth.
PURPOSE OF TEST
The purpose of this test was to establish the structure of the game. I used our finalised assets and experimented with depth to form the Air Region. This allowed me to identify the best placement for specific assets which may have looked out of place during previous tests. For example the huts and torii gates.
EVALUATION OF TEST / ISSUES THAT AROSE
-
Reducing opacity for background assets worked really well in achieving a sense of depth.
-
Placement of Huts and Torii gates in background worked much better than in the foreground. These assets will be placed on top of the background as a result of Parallax Scrolling.
-
Colour palettes work well with each other and art style is kept consistent.
-
Lighting to be organised by Molly to tie in everything together.
-
Background a little light - darken a little to take effect of lanterns.
-
Charismas clouds used in the background are a great addition - representing air region and being in the sky.
-
Height is great, gives the environment a sense of space - representing the air region.
​
Overall our finalised assets are ready to be integrated into Unity. After receiving the last few assets I will create a final mockup and work with Kiera in Unity to organise the structure of the vertical slice. Kiera will be updating her version control log accordingly.
​
CHANGES
​
The background should be darkened to take effect from the light in the environment as this is an important part of the games objective. Other than this the assets are final and we can begin building the main structure.​
​
UPDATED QA TESTING
This can also be found linked in my Blog - found here.
https://docs.google.com/document/d/1Cd_8L4Rqjv_GIfXImfcc5z_L_0qhrX2SvdA2nMsoRFs/edit?usp=sharing
​
​
UPDATED ASSET LIST/MARKING COMPLETION
Can also be found here.
https://docs.google.com/document/d/1w07y71xNHjl7GFcYKodi4pgAAp3s-mzV05Y0VSCCuks/edit?usp=sharing
​
​
Completed assets are highlighted green.
​
Final Assets have been added here:
https://docs.google.com/document/d/1g9XfMxKRRWdh4n7p8RprSkDxvpwselZglnNLOQ8by-c/edit?usp=sharing
NEXT STEPS
My next tasks will be to:
-
Continue with Marketing (work for this can be found here)
-
Begin composition using sound design research (sound design research found in blogs)
-
Animate Butterfly
Wednesday 28th April/Thursday 29th April
-
Molly has sent through her final Eagle animation and sprite sheet for Kiera to implement into Unity.
-
I have begun Sound Design which can be found here: Sound Design
-
Begin and complete butterfly animation - send via Slack to team and for Kiera to integrate into Unity.
TEAM WORK THIS WEEK​
Molly has completed her Eagle animation meeting the requirements for the vertical slice:
1. Sitting eagle to act as obstacle for player
2. Flying eagle to fly during previous stages and sing the corresponding tune.
​
Also completion of Shaman movement.
Charisma provided the team with a virtual sharepoint for all our finalised assets in the form of PNG's: https://drive.google.com/drive/folders/1JyOcKF7K5muzEwlupsbPzFG3Sle3LAks?usp=sharing
MY TASK - 29th April
Butterfly Animation - TRAINING
​
In order to animate the butterfly as realistically as possible I will use online references and videos to assist this. I will also be noting down my process step by step in order to use this for future reference and use this as a learning experience. (Training) I'll use my final butterfly variation made on Adobe Illustrator and animate the movement of the butterfly using Photoshop. I would consider this area of my development as Training, as I am not usually comfortable with animation however I am determined to give it a go. In order to do this to the best of my ability, I have made sure to collect a range of resources to help my process.
​
Link to pinboard: https://pin.it/4A7eLfc
​
​
PROCESS
​
I have collected a number of resources in order to understand the movement of a butterfly to take the animation further. I also found a basic sprite sheet of butterfly movement which I can use as reference in Photoshop. The videos I have sourced are slow-motion closeups of a butterfly flying which will be exceptionally helpful in terms of proportions and realistic movement.
​
SOFTWARE: Photoshop
​
-
I began by separating my butterfly into two parts by making each wing a single asset.
-
I used Photoshops 'Timeline' feature to create a video animation. Video animations allow me to adjust the placement of the wings and adjust this within each layer.
-
I created 8 layers, each one with a different butterfly position.
-
I altered the position of the butterfly by referring to the brief sprite sheet and referring back to the videos sourced from Youtube.
-
As the sprite sheet consists of 5 frames, I added in between stages to create a smoother animation.
-
Once I had the basic structure placed, I put the animation on loop to analyse each layer in depth, and I adjusted the positioning where one wing may have been a bit off in comparison to the last wing placement. Doing this ensured the animation was smooth.
-
I cleaned up the edges by using the 'Eraser Tool' and adjusted where the wings may have overlapped.
-
I then exported this as a GIF by: File > Save for Web > 128 Undithered > Colour 265 > Save as HTML.
-
I was then able to take the separate layers and create PNG's to form a Sprite Sheet for Kiera.
COLOUR PALETTE
​
I'll be using the decided butterfly variation for this which can then be duplicated in Unity and coded to fly in alternating directions.
SPRITE SHEET
I have created a sprite sheet of the 8 frames from the butterfly animation and sent it through to Kiera ready to be used in-game.
FINAL OUTCOME
EVALUATION AND REFLECTION OF WORK
I am happy with the outcome of my animation! This was one of my first animations of this kind therefore, my process was a little different to what I'm used to and pushed me outside my comfort zone. However, I managed to achieve a flying butterfly by warping and changing the perspective of the wings at 8 different stages which combined, appears as if the butterfly is flying.
​
I can take on what I have learned from this and consider this as personal development!
​
I have forwarded the butterfly animation on to Kiera who will integrate this into Unity accordingly.
FRIDAY 30TH APRIL: SLACK MEETING WITH TEAM - LECTURE TASK
​
Discussion with team based on the set Lecture Task - to create a mockup of potential dialogue required in our vertical slice.
DISCUSSION
​
We discussed the basis of a possible dialogue system in Anima Mundi and I drew up a basic storyboard of this with guidance from the Team via a Slack call.
NOTES FROM MEETING:
​
-
Using dialogue in our vertical slice - How could this be used? Why could this be useful?
-
James in lecture spoke about using dialogue system in vertical slice, how could we make use of this in Anima Mundi?
-
Consider using Sound/Audio
-
Will there be specific effects in-game? Maybe transitions? Will these transitions be related to the game?
-
Meeting with team to discuss use of this via 'prompts'.
-
Using prompts in game as guidance and to instruct players - How to use both Gust and Boulder abilities as well as a potential Introduction scene?
- Discussed how the transitions of these prompts could become a part of the environment - clouds to sway into screen when player gets to their first puzzle interaction.
- How will we alert players/present them this? - IDEA: Clouds to sway into screen and during transition should alert players with the sound of a panpipe/harp tune to fit the feel of the environment.
- Task - Visually present this:
EVALUATION
​
We have created an idea for the use of a dialogue system in the form of prompts for our vetical slice.
​
WHY?
These prompts will be useful in order to guide players at the start of the game and introduce them to their special abilities. These prompts will outline the use of their abilities to ease them into gameplay. They should appear at the start of their first puzzle interactions using their 2 abilities both Gust and Boulder throw. These prompts will consist of controls to use and a short description.
​
APPEARANCE
We have decided the most suitable way for the prompts to appear will be if they fit into the environment e.g. through clouds. This way the prompts become part of the environment and don't appear like harsh instructions or guidance, they are simply to just ease the players into a relaxing and peaceful gameplay. The clouds should transition into the scene at a fair pace and use audio effects to alert players. Specifically we collectively decided the sound should reflect the panpipes that appear in a later scene. The way these prompts are displayed can be experimented with by Charisma as she is working on the User Interface for Anima Mundi.
END OF WEEK EVALUATION
PROJECT PIPELINE/MILESTONES // ISSUES THAT OCCURED
​
According to the Pipeline below, we were scheduled to have assets finalised and in by this week. However, as a result of scene testing and a few setbacks, we have been unable to produce these on time. To prevent having to push development back further, we aim to have the last assets handed in by early next week. (Week 10) During Week 10 we can then progress with Sound Design, UI and Lighting production which should take us through to Week 12, where we aim to hand in our full vertical slice.
ARE WE ON TRACK?
We have been unable to produce all assets on time but have set team members a strict deadline for hand in to avoid having to extend this further.
​
If everything goes as expected, we should begin with our next tasks and continue with Unity development. I am optimistic that we will be able to complete everything by the due date - 20th May.
​
SELF EVALUATION
​
Similar to previous weeks I have been focusing on Marketing for both Anima Mundi and our year 2 game studio. I have created the necessary social media channels to promote development of our game and arcade event, and will continue with this until the arcade event takes place. I am on schedule to begin Sound Design by Week 10.
WEEK SUMMARY AND REFLECTION
This week I focused on creating the last few assets and performing tests to ensure these assets work in our final scene. Testing led to some quick changes but nothing that took longer than a few hours therefore I was able to make alterations and stick to our schedule. As well as this I began researching into Sound Design to compose the soundtrack for our vertical slice.
​
We are now waiting on the last few assets to be made which the team are aware of. Kiera has updated each team member of their tasks for next week, most of which are to continue where we left off.
​
This week we kept each other updated on the position of our progress and handed in the work necessary for this week.
NEXT STEPS FOR TEAM
​
DANIELLA
Daniella is scheduled to complete and hand-in her windmill design by next week.
​
CHARISMA
Continuation with asset creation: New style of clouds, using the new background to create effect of the sunset. This should be handed in by next week and will start creating UI mockups.
​
MOLLY
Molly is set to hand-in her ability sprite sheets and continue with her research and study into Lighting/VFX with Nerice.
​
KIERA
Kiera is working on refining her final background and is set to hand this in by next week. As well as this she will continue with Unity development and work with me to adapt our game structure, using the finalised assets.
​
EMILIA
Continuing with Sound Design and Marketing - finalise Anima Mundi Blog. My own plan is to create mockups of each stage of the vertical slice which myself and Kiera can use in our next Unity build.
​
​
How am I feeling?