Trent Wyman


Add'em Atom

Atomic Chemistry Tutorial
Categories:

Add'em Atom Project Screenshot
Project Description: 

Add'em AtomTM is a physical science resource consisting of Flash-based animations & user interactions designed to help students learn the concepts of atomic chemistry in a way that is fun & visually engaging. This interactivity teaches students about element properties, the Periodic Table, simple chemical compound structures, and how elements & compounds are formed.

This application works to teach students about the fundamental properties of atomic elements; the basic structure and classification system of the Periodic Table of Elements; and the simple bonding involved behind chemical compounds and their structures. Add’em Atom shows students how elements and compounds are formed on a microscopic level, through animations and user activities that involve visual art models consisting of basic shapes and simple motion graphics to visually represent such microscopic scenarios. User activities involve building basic atomic elements and simple compound structures by dragging & connecting together different components of artwork to visually create their own atomic models.

Project Goals: 

The goal of Add’em Atom is to create an interactive learning environment that simplifies the concepts of atomic chemistry in a way that entertains and inspires younger students, who may feel challenged when learning this type of subject matter.

Essentially, this is a physics resource as well as a tutorial to assist science students (Middle School & High School) in learning basic concepts behind atomic science and atomic chemistry. Through direct interaction and immersion within a graphically provided Periodic Table of the Elements, students will click through and explore the various elements shown.

While exploring the elements arranged on the Periodic Table, users should quickly learn to identify simple elements by their key physical properties (Atomic Mass, Electron-Configuration, Period Group, etc.) based upon the information they learn from the sub-section that provides animated demonstrations (mini-tutorials), that illustrate atomic concepts and processes.

Target Audience: 

The two main user groups for which this project has been designed/developed are:
- Primary users:
Science students ranging from middle school (7th & 8th grades), to junior high school students (9th – 11th grades)

-Secondary users:
Physical science teachers and others who are generally interested atomic chemistry, particle physics, and / or science in general, for their work, fun, or recreation

Benchmarks: 

The following websites have been analyzed based on similar goals or objectives to those of the Online Application being developed:

- Library.Advanced – http://library.advanced.org/
- Chemical.Elements – http://chemicalelements.com/
- Chemicool – http://chemicool.com/

Technology: 

The technology used to create this project consisted of the following:

Information Architecture:
- organization of content and subject matter such as creating sitemaps, process flows, etc.

Digital Illustration:
- to conceptualize and develop ideas for interactive artwork and visual designs for user interfaces

Vector Art:
- to convert illustrated artwork and concepts into a digital production environment (Adobe Illustrator)

Raster Art:
- to convert vector-based artwork for web delivery, in addition to adding effects & filters (Adobe PhotoShop) to the flat-looking vector graphics in order to produce images that have more depth or more 3-dimensional appearances

Animation:
- to convey physical processes, show sequencing of events, add non-linear perspectives and interactivity through action-scripting and motion graphics

Multimedia Composites:
- compose all content (animated & still images, static & dynamic text, and sounds) into singular and hybrid technological formats interchanged between Flash animations and the dynamic XHTML

Java Scripting:
- for behavioral and controlled delivery of dynamic content through user interaction with the XHTML output

Cascading Style Sheets (CSS):
- for visually formatting the layout and appearance of the web delivered content

XHTML:
- output static and dynamic content through any standard web-based browser