Activity– Create Reminder 1.Select a Folder 2.Click on “Add” Icon 3.Enter Reminder name 4.Click on ”Info” icon 5.Enter Reminder date 6.Click on the “done” button What are the steps to create a reminder?
Activity Flow How are the steps organized spatially on the UI?
Representation To Do List - Table Widget Add Item – Button Date Picker – Calendar Show/Hide Pane – Button Show/Hide Calendar – Button Add List - Button How do we represent the various functions in the UI
Presentation To Do List – Like a Note Pad Add Item – Black button with icon Date Picker – Calendar Show/Hide Pane – Black button with icon Show/Hide Calendar – Black button with icon Add List - Black button with icon How do visualize the different elements in the UI
What is a Homepage Sign post Indicates the “direction” the website will take me in First impression Is it a serious site, is it a fun site… Gateway to a site Provides links to different sections of the site
Homepage is like the rest area along the Internet Highway; You can zip through it or Stop and enjoy the facility
Effective Homepages are designed from a user perspective
Visitors Types & Questions/Needs New user Returning user Accidenta l user Where am IWhat do you do/ have Let me contact you Do I trust you I just want to do it Show me the latest Help me decide Should I stick around Is this the correct site How Do I… - Help
Role of the Homepage Effective Homepages In order to get the user to: -Stay on the site -Explore its content -Buy or use its services
Great Homepage Design Is Informative – tells the visitor What is the site/tool about What can the visitor do on the site with the tool What can the site/tool do for the visitor Resonate with target audience Narrowly focused Speaks the language of visitors of interest Has Compelling value-proposition Convince the user to stick around Jessica Meher, (2013) HubSpot
Great Homepage Design Is Usable Easy to navigate No interruptions Mobile optimized Has Clear Primary and secondary Call-to-action (CTA) Free Trial, Schedule a demo, Buy now, learn more We want the user to dig deeper into the website and move them further down the Purchas-funnel Reflect current needs, problems, and questions of visitors
Great Homepage Design Is Good design Use of layout Call-To-Action placement Use of whitespace Colors Fonts Etc.
Home Page Example Simple design with strong headline Feels secure, but easy to use Good CTA-Free! Get Started Clear supporting image
Home Page Example Simple and effective headline - Remember Everything Arranged into 3 clear benefits that jump out because of the rich green background Eye path leads us to the CTA – “Get Evernote, its free”
Home Page Example Great headline Placement of customers at the center Sign-up form directly on the homepage