Animate keyboard and City example
On Adobe Animate I opened the new document and named it CityExample (W-960, H-640, Frame rate-30, on platform HTML5 Canvas).
Then created seven different layers( sky_day, sky_night, city_day, city_night, buttons,labels, actions), next I clicked on the city day layer and used the rectangle tool to draw out my style of skyscrappers in the city with different colours then selected the whole drawings and modify-convert to symbol (movie clip)then named it city_ day then on the symbol page i added new layers for the building and the windows as well, on windows layer i put in my windows and duplicated and fixed in a few windows(pink) then on buildings layer i selected the frames to 30 and right clicked to add in frames, while for windows i selected frame 10, 20 and 30 and added keyframes on each keyframes moved I took out and adjusted some windows and duplicated the cityday simbol under layer and renamed it to city night then double clicek the symbol - tapped the windows layer then select the windows and shift key to select all windows then under properties panel changed the colour to a different colour. on the main scene clicked on city_day and dragged in the cityday from library into the scene then clicked on city_night then dragged in the city night made from under the library into the scene.
On the sky_day layer, I used the rectangle tool to draw a rectangle on the layer then filled in my sky colour then converted it to a symbol(movie clip) then named the layer (sky), new layer (clouds), layer(sun) on the cloud layer i put in white cpheres to create clouds then for the eye and smiley face i filled in a black little sphere and adjusted itr to size then put it in the clouds and place them on the sky layer, for the sun i clicked the sun layer and used sphere with yellow fill in colour shift and clicked to draw a perfect circle then with rectangle tool i made sun shades by resizing and adjusting the rectangles and rotating it under free transform then placed them on the sky page.
For the night sky i duplicated the day_night under library and named it sky_night then clicked on the sky then on properties panel changed the sky colour and for clouds i changed the colour under properties panel then deleted the sun layer as it isn't needed in the sky_night symbol then put in little white sphere dots to represent stars. Then adjusted the layer on the main frame to be at the same level with the day layer and the buildings,
For the piano, I downloaded the key board sound From the unit folder then imported it into the piano folder on Adobe animate. Then made rectangles for the white keyboard and added sound to each key button and drag sound to the hit frames. I duplicated the rectangle and added alphabets to each rectangle and added the sound to the buttons and for the black key buttons I duplicated and added sounds to them as well.



Comments
Post a Comment