Rachel Hollowgrass UX Architect rhollow@berkeley.edu Prototyping in Flash CS298-48 HCI Design Clinics April 26, 2010
User Experience Prototyping at Berkeley in Flash UX on campus UX positions are new on campus Working to recognize and improve UX on more projects Rachel 13 years at Apple 5 years as Flash developer Fence sitter: technical and functional
Prototyping in Flash Why Use Flash? Nice Vector format means no jaggies Frame-based animation Video content of many kinds Core Rich interaction beyond HTML 5 Virtually no cross-browser issues Compiled, not interpreted
Prototyping in Flash Why Use Flash Professional? Other Adobe tools: Vector format means no jaggies Frame-based animation Video content of many kinds Flash Professional and Flex: Rich interaction
Prototyping in Flash Flash Filetypes fla Programming language is called ActionScript Flash Professional’s source format swf Compiled output from many Adobe tools including Catalyst, Flex and Flash Professional html, js and Flash plugin Required to run swf in a browser
Overview of Prototyping in Flash Software Objects Objects Can model real-world or virtual items Example: Person Properties (“qualities”) Name Age Mood Methods (“capabilities) Eat Sing
Objects: Prototyping in Flash Classes and Instances Class A pattern or concept Example: Homo Sapiens Instance An actual person Example: Barack Obama Instance creation Class constructor method or Flash stage item with instance name
Connections: Prototyping fla-to-code in Flash ShowHide.as ⬅ code file File organization >> class ShowHide ⬅ class definition Containing folder > code ⬅ folder for code >> function ShowHide ⬅ constructor >> ShowHide.as ⬅ code file > showHide.fla ⬅ source file
Connections: Prototyping stage-to-instances in Flash On the Flash Stage An item on the Flash stage can only be addressed in ActioScript if it is given an instance name that is unique for that project.
Prototyping in Flash The Portal Project Student Portal New project on campus Now hiring student developers and designers http://campuslife.berkeley.edu/myberkeleyproject http://campuslife.berkeley.edu/myBerkeleyproject_jobs
Recommend
More recommend