360 likes | 573 Views
Alexion Medical Evidence Bank – Wireframe. Prepared by Chameleon December 12, 2013. Alexion Medical Evidence Bank - Wireframes. Purpose of the document is to gather feedback and come to agreement on text, visual and interactive elements of each screen and its basic layout.
E N D
Alexion Medical Evidence Bank – Wireframe Prepared by Chameleon December 12, 2013
Alexion Medical Evidence Bank - Wireframes Purpose of the document is to gather feedback and come to agreement on text, visual and interactive elements of each screen and its basic layout. Wireframe document outlines basic screens for the deliverables in a wireframe format. It is a flat document to show page contents and describe basic functionality. Once agreed upon, the wireframe will provide input for the screen design phase where elements will be taken into account when styling and branding the app and website. Wireframe document follows the overall sitemap as laid out on following pages. Assumptions It has been assumed that the Alexion Medical Evidence Bank scope of work document and sitemap is used as the basis and guide for the unique screens in the wireframe. Any alterations to the these may alter the wireframe for the application and/or website. This document does not contain any additional elements such as privacy statements, terms and conditions and Alexion specific app publishing guidelines as clarification is still outstanding from Alexion IT.
1.0 Login • Users can login with their username and password (they will be emailed to them directly) 1
1.1 Forgot password • Users can enter their Alexion email address to have password recovery information emailed to them (a link to reset) 1
1.2 Help and contact • Users can contact Alexion using the provided information 1
2.0 Welcome • Users can access case studies directly • Users can access presentations directly • Users can sync at anytime with the available items on the server which will ensure they are always up-to-date • Link to help/contact pop-up shown earlier • Will return the user to the login screen • Will allow the user to switch at any time between case study and presentation modes 3 1 2 5 4 6
3.0 Dashboard • Users are shown a list of the available core and custom presentations that are available • Users can run, go to slide sorter to edit, duplicate, email evidence and delete presentations • Clicking on a filter will take the user to a search screen 3 1 2
3.1 Dashboard – Presentation delete confirmation • Delete presentation confirmation box 1
4.0 Create presentation from scratch • Indication has been selected filtering the relevant slides and moving into search mode • Clicking on the evidence tab will open the evidence drawer where users can email out evidence (slide 34/35) • Touching the plus icon will bring up the ‘add slides’ drawer where users can see the shopping basket of their slides (slide 10) • Touching the spyglass icon will show the slide in full screen (slide 28) 1 2 3 4
4.1 Indication overview • Touching indication overview will pull out a text drawer showing additional information 1
4.2 Add slides drawer - Small • Slides that have been added to the shopping basket can be seen in the drawer which will automatically be bought up, but can be seen at any time by dragging the tab up at the bottom of the screen. • Delete slides from the drawer by clicking the red cross, or drag to re-order • Users can give the presentation a title and a name for the person presenting, along with a date • Save the presentation or cancel adding slides 1 3 4 2
4.3 Add slides drawer - Large • Users can drag the small drawer up to become full screen where all slides are available to edit (re-order and delete) 1
4.4 Add slides drawer – Large - Success • Pop-up appears after pressing save on previous screen 1
5.0 Duplicate presentation • When duplicating a presentation the existing name appears in the title with the suffix “copy” • Clicking on the add slides icon will lower the drawer and move the user to the filter page (slide 14) 1 2
5.1 Duplicate presentation – Add slides • Users can add slides here to go into the duplicated presentation
5.2 Add slides drawer - Small • Slides will appear in the shopping basket as before
5.3 Add slides drawer - Large • Slides are available to edit in the full screen version of the drawer
5.4 Duplicate presentation - Success • When a presentation is created users can select from the available options on the confirmation box
6.0 Slide sorter • Presentation can be edited and added in the slide sorter view as per slide 13
6.4 Slide sorter – Presentation saved Interactivity
7.0 Dashboard – Case Studies • By default all case studies are available (comprising 3 slides per study) • Can studies can be run, have evidence emailed and be deleted from the device (will be re-downloaded on next sync) 1 1
7.1 Dashboard – Case studies selected • As with main slides, case studies can be filtered by using the buttons • Touching case overview will bring up key points and notes around the case study topic selected 1 2
7.2 Case studies selected with overview • When open, case overview notes can be closed by touching the tab 1
7.3 Dashboard – Case studies – Delete confirmation • Delete confirmation box
8.0 Run presentation • The presentation name when the deck has been created is shown by default as the first slide • Clicking edit at the start of the presentation will open sorter view (slide 33) 2 1
8.1 Slideshow slide • Slides are show in full-screen 1
8.2 Slideshow with top bar • Double tapping in the centre of the screen will bring up a top bar with an option to close/end the slideshow 1
8.3 Slide show – evidence drawer • Bringing up the bottom bar while in slideshow mode will show the available evidence along with the slide • Touching the relevant slide will show the evidence associated with it • Evidence will show as a PDF icon, touching the icon will load the evidence PDF, touching the mail symbol will divert the user to the email screen (slide 34/35) 1 3 2
8.4 Slideshow evidence • Evidence opens up in system PDF reader • To exit PDF view, double tapping as per the other screen will bring up a top bar with a close/end link
8.5 Slideshow evidence with drawer • The evidence and slide you are currently viewing will be highlighted when the drawer is pulled up in evidence view 1
8.6 Run presentation – Edit • Slides can be edited in the sorter mode
9.0 Email evidence drawer • Whenever evidence is selected in the top-right the email screen will be seen. Evidence can be selected to be sent out as an email • Users can enter the recipient email address, subject line and choose to zip up the multiple files if needed 2 1
9.1 Email evidence drawer – Email sent Interactivity