Splatter “The Multiplayer Paint” By: David Kikuta CMSI 402, Spring 2011

Project Description Drawing application for the Apple iPad. Quick way to design and store ideas. Requires at least one iPad, but two iPads can draw together on the same network. Target audience is those who work in a team environment.

Project Goals Splatter is an exercise on learning Objective C and how to create applications for the iPad. Create an application that provides users a convenient way to design and save their ideas for future use. Learn how to network multiple iPads. Learn about data storage on an iPad.

User Interface Buttons – New, Save, Open, Information, Connect Color sliders and output display (R,G,B) Pre-made color selector Adjustable brush width Removable toolbar and color selector

Use Case Diagram Show Product Information Select New Color Save Current Design Load Previous Design Create New Design Change Selected Color Draw Connect to iPad Handle Files User iPad > Splatter Change Brush Width

Class Diagram ColorsView SplatterView BrowserViewController InformationView ConfirmationView SplatterViewController ConfirmationViewController ToolView SplatterAppDelegate ColorChooser InformationViewController PickerView TCPServer Model View Controller Loading View Controller LoadingView

User Story – Saving an Image User runs the Splatter application. Application loads completely. User touches and drags on canvas to create a design. Application draws as the user is dragging. User lifts finger off the iPad. Application stops drawing. User touches “save” button. Application recognizes the button press and prompts save window. User accepts the save. Application saves the image from the canvas to the iPad Photo Album.

Sequence Diagram: Choosing a Color 1: Move Color Slider SplatterViewController ColorChooser 2: Color Value Changed 4: New Color Value Obtained 5: Update View With Value(s) 6: Display Updated View User 3: Updated Color Value

Activity Diagram: Drawing Draw Wait for input Run Splatter Draw dot Adjust width/color Touch UI element Draw line Adjust Color Do button function tap“drag” manual pre-made done not finished start end

A Little Bit About Networking Each iPad has an instance of TCPServer. Sockets and input/output streams are created on launch and handle network messages. Messages are sent containing the message length and the appropriate data provided by the touch event.

Project Challenges and Lessons Learned Learning and working with Objective C. Xcode helped a lot! Working with a mixture of programmatically created UI widgets as well as the Interface Builder. Understanding and using the Bonjour protocol to detect other iPads on a local network. “Helpful” value logging is not always helpful!

Questions?