Rive Lightning Simulator
Rive Lightning Simulator
This project is a fun & interactive way to explore how storms form by adjusting key environmental factors.
This project is a fun & interactive way to explore how storms form by adjusting key environmental factors.
Rive Lightning Simulator
This project is a fun & interactive way to explore how storms form by adjusting key environmental factors.
ROLE
ROLE
UX Design, Graphic Design, (Partner Project)
UX Design,
Graphic Design, (Partner Project)
UX Design, Graphic Design, (Partner Project)
TIMELINE
TIMELINE
August - October 2024
August - October 2024
August - October 2024
SKILLS
SKILLS
Rive Node-Based Prototyping,User Research, UX/UI Design
Rive Node-Based Prototyping
User Research,
UX/UI Design
TOOLS
TOOLS
RIVE, Adobe Illustrator
RIVE, Adobe Illustrator
RIVE, Adobe Illustrator
Project Overview
Project Overview
This Lightning Simulator is an interactive, cartoon-styled experience that teaches users about lightning formation. By adjusting environmental factors like moisture, terrain, and temperature, users can create storm conditions and trigger lightning strikes, making learning both engaging and fun.
This Lightning Simulator is an interactive, cartoon-styled experience that teaches users about lightning formation. By adjusting environmental factors like moisture, terrain, and temperature, users can create storm conditions and trigger lightning strikes, making learning both engaging and fun.
THE OVERARCHING GOAL
THE OVERARCHING GOAL
THE OVERARCHING GOAL
Make learning about weather and lightning formation more engaging and less intimidating. By combining UI design, animation, and interactive elements, this project transforms complex scientific concepts into an intuitive, hands-on experience. Users can explore environmental factors that influence lightning, fostering curiosity and deeper understanding through play.
Make learning about weather and lightning formation more engaging and less intimidating. By combining UI design, animation, and interactive elements, this project transforms complex scientific concepts into an intuitive, hands-on experience. Users can explore environmental factors that influence lightning, fostering curiosity and deeper understanding through play.
Make learning about weather and lightning formation more engaging and less intimidating. By combining UI design, animation, and interactive elements, this project transforms complex scientific concepts into an intuitive, hands-on experience. Users can explore environmental factors that influence lightning, fostering curiosity and deeper understanding through play.
1
1
1
Research
Research
Research
MOISTURE LEVELS
MOISTURE LEVELS
MOISTURE LEVELS
Higher humidity fuels cloud formation and storms, creating ideal conditions for lightning.
Higher humidity fuels cloud formation and storms, creating ideal conditions for lightning.
Higher humidity fuels cloud formation and storms, creating ideal conditions for lightning.
CHARGE SEPARATION
CHARGE SEPARATION
CHARGE SEPARATION
Colliding ice and water particles create electrical charges, leading to lightning strikes.
Colliding ice and water particles create electrical charges, leading to lightning strikes.
Colliding ice and water particles create electrical charges, leading to lightning strikes.
TERRAIN
TERRAIN
TERRAIN
Elevated areas and tall structures increase the likelihood of lightning strikes.
Elevated areas and tall structures increase the likelihood of lightning strikes.
Elevated areas and tall structures increase the likelihood of lightning strikes.
DISTANCE
DISTANCE
DISTANCE
The farther you are from a lightning strike, the longer it takes for thunder to reach you.
The farther you are from a lightning strike, the longer it takes for thunder to reach you.
The farther you are from a lightning strike, the longer it takes for thunder to reach you.
2
2
2
Visual Designs
Visual Designs
Visual Designs
Design Goals
Design Goals
INTERACTIVE LEARNING
Use engaging visuals and hands-on controls to make complex weather concepts intuitive and fun.
Use engaging visuals and hands-on controls to make complex weather concepts intuitive and fun.
SEAMLESS UI & ANIMATION
Blend motion design with a clean, user-friendly interface for an immersive experience.
Blend motion design with a clean, user-friendly interface for an immersive experience.
Blend motion design with a clean, user-friendly interface for an immersive experience.
SCIENTIFIC ACCURACY
Present key lightning formation factors in a simplified yet educational way.
Present key lightning formation factors in a simplified yet educational way.
Present key lightning formation factors in a simplified yet educational way.
FINDING INSPIRATION
FINDING INSPIRATION
THE STYLE
THE STYLE
THE ITERATIVE PROCESS
THE ITERATIVE PROCESS
Early Concepts: We started with a control panel-style UI to establish core interactions while familiarizing ourselves with Rive.
Early Concepts: We started with a control panel-style UI to establish core interactions while familiarizing ourselves with Rive.
Early Concepts: We started with a control panel-style UI to establish core interactions while familiarizing ourselves with Rive.
UI & Interaction Design: Initial designs were complex, but we refined them into a clean, intuitive interface inspired by Apple’s simplicity.
UI & Interaction Design: Initial designs were complex, but we refined them into a clean, intuitive interface inspired by Apple’s simplicity.
UI & Interaction Design: Initial designs were complex, but we refined them into a clean, intuitive interface inspired by Apple’s simplicity.
Final Adjustments: We fine-tuned animations, interactions, and visuals to create a seamless experience that balances education and engagement.
Final Adjustments: We fine-tuned animations, interactions, and visuals to create a seamless experience that balances education and engagement.
Final Adjustments: We fine-tuned animations, interactions, and visuals to create a seamless experience that balances education and engagement.
3
3
3
Final Designs
Final Designs
Final Designs
TAKEAWAYS
This project strengthened my passion for UI and animation, showing how motion enhances learning. Rive challenged me to develop new skills, and strong teamwork helped create a polished final product.
NEXT STEPS
I’ll refine interactions, incorporate feedback for my portfolio, and continue exploring UI motion design as a career path.
I’ll refine interactions, incorporate feedback for my portfolio, and continue exploring UI motion design as a career path.