Designer Lesson 4
Add the Bullseye Display component
Add a background image with five bullseye buttons
Add an individual image for each of the five buttons on the bullseye display
Complete Lesson 4 video instruction
Complete Lesson 4 Activities
The Bullseye Display adds user functionality and allows the user to easily move further into the application.
Lesson 4 Video: Bullseye Display
Training App – Lesson 4 Bullseye Display
Design Concepts: Optimal Image Size
Keep in mind the correct image size for different components when building your application.
Bullseye = 400(w) x 400(h) pixels
Image Full Width = 400(w) x 200(h) pixels
Title Image Full Width = 400(w) x 150(h) pixels
Page Background image = 400(w) x 850(h) pixels
You may need to rescale an image before using it.
The Bullseye Display is the most often used component. With it users can move deeper into an application with ease. Different images can be used on the bullseye display to engage both user interest and curiosity. Keep in mind that images should meet four main criteria:
create visual harmony
add emphasis by creating a mood
draw the user’s attention
convey the scope and vision of the school, business, or city
Images that hook user interest are essential to use on a bullseye display.