Wired is a monthly American magazine, published in print and online editions, that focuses on how emerging technologies affect culture, the economy, and politics.
Design and Animation: Xianglin Mu + Yiran Wang
Voice over: Teagan Giese
Sound: Kelly Warner + Universal Production Music
Why
For Wired
The printed version is losing viewership while the online and mobile audience is growing. Adding animation to online content will increase our awareness as a contemporary source of information.
How
For Us
To create clear, engaging, and visually stunning assets that support online articles.
What we get
Final Animation
Style Frame Process
3 VISUAL APPROACHES+ ARTICLE CHOSEN
How does a vinyl record work?
Have you ever imagined what it was like before music streaming was possible? Let's go back in time and see how music is recorded onto vinyl and reproduces sound.
To start, let's consider what sound is. Sounds are produced by vibrations that travel as waves through the air. The waves transfer energy from the source of the sound to its surroundings. Once the vibrations reach human ears, they vibrate the eardrums, and that's how we hear sound. These vibrations can be represented by grooves that are pressed into vinyl records.
So how can we hear sound from a vinyl record? A record player has a needle called a stylus placed on the record resting at the beginning of the groove. As the stylus vibrates in the groove, the movement is transmitted down the bar. The metal bar presses against the stylus, and each time it moves, it generates electrical signals. These signals are fed out to the amplifier to make the sounds you hear.
Now you know how a vinyl record works, so sit back and enjoy listening to the music!
STORYBOARDS
15 STYLE FRAMES
The Class Feedback
-
-
Adopt the second Collage design style but keep the first and third initial frame layout.
-
-
Complete the voice over of the text.
Animation Process
ANIMATIC+MOTION TEST
The Class Feedback
For the animatic, improve the transformation part to make it clearer.
For the first motion test, be careful with the vinyl decoration and background echo movement.
For the second motion test, place more emphasis on the vitality and energy of the motion.
BOARDMATIC
The Class Feedback
Keep working on the animation part, refining the stylus animation.
Make sure the edges of the image are clean.
ANIMATION SECOND PASS
In this round, we first finished the main block animation and each frame transition part. After the class critique, here is the feedback we received:
1. Reduce the speed of the topping texture movement.
2. Remove the first frame's "grass" texture from the album cover.
3. Continue to work on the audio waves."
ANIMATION THIRD PASS
Based on the last feedback, we made changes to the animation.
Here is the new feedback:
Continue to work on the audio waves. The red background echo needs improvement.
Reduce the speed of the wiggle effect for all the animation.
3. Complete the "ear" frame animation.
ANIMATION FOURTH PASS
As we continued to improve our animation, no major problems were identified. However, one issue that was noted is that the animation of the amplifier feels underdeveloped. The prominent electronic symbol is taken away from the visual center by the other red orbs..
Final Animation
AR Experience
MAGAZINE MOCKUP
We designed our page layout based on the existing structure of WIRED magazine, and incorporated an AR mobile application called 'Artivive' to bring the images to life through augmented reality
