SlideShare une entreprise Scribd logo
1  sur  5
PAL #6: Button Symbols & Code Snippets
   Buttons are designed specifically to react to
    the user’s mouse and keyboard actions.
   Like other symbol instances, each button
    instance can have its own set of
    characteristics.
   To edit a button symbol, you need to double
    click on the instance on the stage.
   The Up state is the button’s default appearance when it’s just sitting on the
    Stage without any user interaction.
   The Over state displays when the mouse pointer moves over a button. This
    indicates to the user that the button is a control that can carry out some
    action in your movie.
   When the user presses down on the mouse button, the button symbol
    changes to its Down state. It remains in its Down state until the user
    releases the button; because the Down state is briefly visible during a
    typical mouse click, customising a it with a lengthy animation or sound is
    not the best idea.
   The Hit area defines the hot spot where the button becomes active when
    the user moves over it.
When designing buttons, keep your users in mind and follow these
guidelines:
   Aim for an interesting design that makes the navigation process
    easy for users to understand. An interesting-looking button may
    entice users to click on it.
   Make a button’s purpose clear. Although you already know what
    all your buttons do, and where they’ll lead, users aren’t as familiar
    as you are with what’s going on. Design buttons with familiar
    shapes (for example, a Play button that looks like a forward
    arrow), or label buttons with text if necessary.
   Make buttons easy to find. If the buttons are hard to pick out on
    the interface, or if their functions are unclear, your interactive
    project becomes a frustrating experience for the user.
   Use the button images on Moodle to create a
    simple three-state button with ‘Up’, ‘Down’
    and ‘Over’ keyframes.
   Upload your completed SWF to Moodle

      UP               OVER             DOWN

Contenu connexe

Plus de jbellWCT

Hci ass3-bad
Hci ass3-badHci ass3-bad
Hci ass3-badjbellWCT
 
HCI Assignment 2 - Fail
HCI Assignment 2 - FailHCI Assignment 2 - Fail
HCI Assignment 2 - FailjbellWCT
 
Models of Interaction
Models of InteractionModels of Interaction
Models of InteractionjbellWCT
 
Principles of Interface Design
Principles of Interface DesignPrinciples of Interface Design
Principles of Interface DesignjbellWCT
 
Remote Controls - HCI - Assignment 1
Remote Controls - HCI - Assignment 1Remote Controls - HCI - Assignment 1
Remote Controls - HCI - Assignment 1jbellWCT
 
CSS3: The Next Generation Of Style
CSS3: The Next Generation Of StyleCSS3: The Next Generation Of Style
CSS3: The Next Generation Of StylejbellWCT
 
Hyperlinks
HyperlinksHyperlinks
HyperlinksjbellWCT
 
Images & Dreamweaver
Images & DreamweaverImages & Dreamweaver
Images & DreamweaverjbellWCT
 
Typography
TypographyTypography
TypographyjbellWCT
 
Creating Pages
Creating PagesCreating Pages
Creating PagesjbellWCT
 
Setting Up Dreamweaver
Setting Up DreamweaverSetting Up Dreamweaver
Setting Up DreamweaverjbellWCT
 
PAL #9: Introduction to ActionScript
PAL #9: Introduction to ActionScriptPAL #9: Introduction to ActionScript
PAL #9: Introduction to ActionScriptjbellWCT
 
Network Hardware PAL#8
Network Hardware PAL#8Network Hardware PAL#8
Network Hardware PAL#8jbellWCT
 
Signing Up To Tumblr
Signing Up To TumblrSigning Up To Tumblr
Signing Up To TumblrjbellWCT
 
Sight Conditions
Sight ConditionsSight Conditions
Sight ConditionsjbellWCT
 
Exploring GOMs
Exploring GOMsExploring GOMs
Exploring GOMsjbellWCT
 

Plus de jbellWCT (18)

Hci ass3-bad
Hci ass3-badHci ass3-bad
Hci ass3-bad
 
Hci ass2
Hci ass2Hci ass2
Hci ass2
 
HCI Assignment 2 - Fail
HCI Assignment 2 - FailHCI Assignment 2 - Fail
HCI Assignment 2 - Fail
 
Models of Interaction
Models of InteractionModels of Interaction
Models of Interaction
 
Principles of Interface Design
Principles of Interface DesignPrinciples of Interface Design
Principles of Interface Design
 
Remote Controls - HCI - Assignment 1
Remote Controls - HCI - Assignment 1Remote Controls - HCI - Assignment 1
Remote Controls - HCI - Assignment 1
 
CSS3: The Next Generation Of Style
CSS3: The Next Generation Of StyleCSS3: The Next Generation Of Style
CSS3: The Next Generation Of Style
 
Hyperlinks
HyperlinksHyperlinks
Hyperlinks
 
Images & Dreamweaver
Images & DreamweaverImages & Dreamweaver
Images & Dreamweaver
 
Typography
TypographyTypography
Typography
 
Tables
TablesTables
Tables
 
Creating Pages
Creating PagesCreating Pages
Creating Pages
 
Setting Up Dreamweaver
Setting Up DreamweaverSetting Up Dreamweaver
Setting Up Dreamweaver
 
PAL #9: Introduction to ActionScript
PAL #9: Introduction to ActionScriptPAL #9: Introduction to ActionScript
PAL #9: Introduction to ActionScript
 
Network Hardware PAL#8
Network Hardware PAL#8Network Hardware PAL#8
Network Hardware PAL#8
 
Signing Up To Tumblr
Signing Up To TumblrSigning Up To Tumblr
Signing Up To Tumblr
 
Sight Conditions
Sight ConditionsSight Conditions
Sight Conditions
 
Exploring GOMs
Exploring GOMsExploring GOMs
Exploring GOMs
 

Dernier

Search Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdfSearch Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdfRankYa
 
Commit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyCommit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyAlfredo García Lavilla
 
Powerpoint exploring the locations used in television show Time Clash
Powerpoint exploring the locations used in television show Time ClashPowerpoint exploring the locations used in television show Time Clash
Powerpoint exploring the locations used in television show Time Clashcharlottematthew16
 
My INSURER PTE LTD - Insurtech Innovation Award 2024
My INSURER PTE LTD - Insurtech Innovation Award 2024My INSURER PTE LTD - Insurtech Innovation Award 2024
My INSURER PTE LTD - Insurtech Innovation Award 2024The Digital Insurer
 
Unleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding ClubUnleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding ClubKalema Edgar
 
"Federated learning: out of reach no matter how close",Oleksandr Lapshyn
"Federated learning: out of reach no matter how close",Oleksandr Lapshyn"Federated learning: out of reach no matter how close",Oleksandr Lapshyn
"Federated learning: out of reach no matter how close",Oleksandr LapshynFwdays
 
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks..."LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...Fwdays
 
Beyond Boundaries: Leveraging No-Code Solutions for Industry Innovation
Beyond Boundaries: Leveraging No-Code Solutions for Industry InnovationBeyond Boundaries: Leveraging No-Code Solutions for Industry Innovation
Beyond Boundaries: Leveraging No-Code Solutions for Industry InnovationSafe Software
 
Gen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdfGen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdfAddepto
 
Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 365Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 3652toLead Limited
 
Designing IA for AI - Information Architecture Conference 2024
Designing IA for AI - Information Architecture Conference 2024Designing IA for AI - Information Architecture Conference 2024
Designing IA for AI - Information Architecture Conference 2024Enterprise Knowledge
 
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage CostLeverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage CostZilliz
 
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024BookNet Canada
 
WordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your BrandWordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your Brandgvaughan
 
Advanced Test Driven-Development @ php[tek] 2024
Advanced Test Driven-Development @ php[tek] 2024Advanced Test Driven-Development @ php[tek] 2024
Advanced Test Driven-Development @ php[tek] 2024Scott Keck-Warren
 
Human Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR SystemsHuman Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR SystemsMark Billinghurst
 
Scanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL CertsScanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL CertsRizwan Syed
 
The Future of Software Development - Devin AI Innovative Approach.pdf
The Future of Software Development - Devin AI Innovative Approach.pdfThe Future of Software Development - Devin AI Innovative Approach.pdf
The Future of Software Development - Devin AI Innovative Approach.pdfSeasiaInfotech2
 

Dernier (20)

Search Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdfSearch Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdf
 
Commit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyCommit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easy
 
Powerpoint exploring the locations used in television show Time Clash
Powerpoint exploring the locations used in television show Time ClashPowerpoint exploring the locations used in television show Time Clash
Powerpoint exploring the locations used in television show Time Clash
 
My INSURER PTE LTD - Insurtech Innovation Award 2024
My INSURER PTE LTD - Insurtech Innovation Award 2024My INSURER PTE LTD - Insurtech Innovation Award 2024
My INSURER PTE LTD - Insurtech Innovation Award 2024
 
Unleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding ClubUnleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding Club
 
"Federated learning: out of reach no matter how close",Oleksandr Lapshyn
"Federated learning: out of reach no matter how close",Oleksandr Lapshyn"Federated learning: out of reach no matter how close",Oleksandr Lapshyn
"Federated learning: out of reach no matter how close",Oleksandr Lapshyn
 
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks..."LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
 
Beyond Boundaries: Leveraging No-Code Solutions for Industry Innovation
Beyond Boundaries: Leveraging No-Code Solutions for Industry InnovationBeyond Boundaries: Leveraging No-Code Solutions for Industry Innovation
Beyond Boundaries: Leveraging No-Code Solutions for Industry Innovation
 
Gen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdfGen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdf
 
Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 365Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 365
 
DMCC Future of Trade Web3 - Special Edition
DMCC Future of Trade Web3 - Special EditionDMCC Future of Trade Web3 - Special Edition
DMCC Future of Trade Web3 - Special Edition
 
Designing IA for AI - Information Architecture Conference 2024
Designing IA for AI - Information Architecture Conference 2024Designing IA for AI - Information Architecture Conference 2024
Designing IA for AI - Information Architecture Conference 2024
 
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage CostLeverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
 
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
 
WordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your BrandWordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your Brand
 
Advanced Test Driven-Development @ php[tek] 2024
Advanced Test Driven-Development @ php[tek] 2024Advanced Test Driven-Development @ php[tek] 2024
Advanced Test Driven-Development @ php[tek] 2024
 
Human Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR SystemsHuman Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR Systems
 
Scanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL CertsScanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL Certs
 
E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptx
E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptxE-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptx
E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptx
 
The Future of Software Development - Devin AI Innovative Approach.pdf
The Future of Software Development - Devin AI Innovative Approach.pdfThe Future of Software Development - Devin AI Innovative Approach.pdf
The Future of Software Development - Devin AI Innovative Approach.pdf
 

PAL #6: Button Symbols & Code Snippets

  • 1. PAL #6: Button Symbols & Code Snippets
  • 2. Buttons are designed specifically to react to the user’s mouse and keyboard actions.  Like other symbol instances, each button instance can have its own set of characteristics.  To edit a button symbol, you need to double click on the instance on the stage.
  • 3. The Up state is the button’s default appearance when it’s just sitting on the Stage without any user interaction.  The Over state displays when the mouse pointer moves over a button. This indicates to the user that the button is a control that can carry out some action in your movie.  When the user presses down on the mouse button, the button symbol changes to its Down state. It remains in its Down state until the user releases the button; because the Down state is briefly visible during a typical mouse click, customising a it with a lengthy animation or sound is not the best idea.  The Hit area defines the hot spot where the button becomes active when the user moves over it.
  • 4. When designing buttons, keep your users in mind and follow these guidelines:  Aim for an interesting design that makes the navigation process easy for users to understand. An interesting-looking button may entice users to click on it.  Make a button’s purpose clear. Although you already know what all your buttons do, and where they’ll lead, users aren’t as familiar as you are with what’s going on. Design buttons with familiar shapes (for example, a Play button that looks like a forward arrow), or label buttons with text if necessary.  Make buttons easy to find. If the buttons are hard to pick out on the interface, or if their functions are unclear, your interactive project becomes a frustrating experience for the user.
  • 5. Use the button images on Moodle to create a simple three-state button with ‘Up’, ‘Down’ and ‘Over’ keyframes.  Upload your completed SWF to Moodle UP OVER DOWN