A Study for the system architecture and design of the third version of Epidemic Marketplace in 2012/2013

1. Re-Think EM
Study of the System Architecture

2. (Simon Sinek)

3. The why of this re-construction, and re-
design
Why?

4. ● We all want to be healthy
● We would like that EM could be a reference
in terms of Epidemiological Resources
● We strongly believe in an Open Market
Why

5. Main problems
● We still aren't a reference
○ Lack on promotion
■ Low penetration in the Epidemiological
Community and in the Web in general
■ Failures in terms of Search Engine Optimization
(SEO)
■ Are the resources unique and exclusive?
● Open Market
○ Critical Mass
■ Are we presenting the information correctly?

6. Low penetration in the web - The
problem
● On the search engines:
○ Example:
in Google search result for "h1n1", EM doesn't appear on the first 300 positions
○ The unique identified keyword is "epidemic marketplace"
○ Low external references, just 2
● Most visitors enters directly the site. Without using Google for instance.
● On September, we had 16,12% new visitors
● 836 unique visits ~= 2.28 people/day
● 57% Bounce rate
(Google Analytics 2011-2012)

7. Title: Data collector - H1N1 - all locations
URL: https://www.epimarketplace.net/resource/empid_117/details

8. Optimization errors: Duplicate content

9. 294 resources... Are they unique or exclusive, how many could we have?
Resources - The problem

10. How are we thinking doing it?
How?

11. ● Resources
○ Outsourcing and/or Crowdsourcing and User-
generated content
○ Sync Epiwork
○ Promote the collaborative component of the platform
● Promotion
○ Promote the use in the community and within the
Epiwork project
○ Offsite SEO
● Enhance the User Interface
● Enhance the Information Architecture
■ Keep SEO in mind all the time
How

12. “To lay out paths, first place goals at natural points of interest. Then connect
the goals to one another to form the paths.”
Christopher Alexander
Desire paths - Information Architecture

13. http://www.boxesandarrows.com/view/designing-screens

14. Original site map - Juliana Duque

15. Site Map on October, 2012

16. Resources
Requests
Webservices
Pages
Announcement

17. The cores
Resources
Requests
Webservices/
Documentarion
Pages/Documentation
Articles/Announcements

18. ● It's an abstract entity that represents one
epidemiological resource
● It's composed by several datastreams
● One of the datastreams it's the Metadata
and the others are for the Data
Resources

19. Inwards: Resources
. Homepage Links to most visited resources
. Create Resource Redirect after resource creating process
. My Resources Reserved area to access all my resources,
those which I'm the owner
. Internal Search Facet navigation, search results by keyword
. Search engines search SEO and landing pages
. Twitter, Facebook,
Social media
Links from social networks
. Links from other sites Links from sites of the Epidemiological
Community

20. Outwards: Resources
. Share Resources sharing, login required 1
. Share to Social Networks Sharing to social networks, login required 3
. Add to favourites Call for action: Add to my favourites. Login required 2
. Comment Form to add new comments 2
. Add resource to a collection Login required
. Webservices Link for more information about related webservice 2
. Collection Link to display the associated collection, it requires login 3
. Request access Call for action: Request to Access the resource 2
. Create new collection Login required
. Search (Browse) Link for filtering resources by type, uploader 1
. Download Download datastreams 2
. History* Link to page with the resources revision history 2
. Report abuse Call for action: report a resource that violates usage terms and
conditions
2
. Edit Call for action to change the resource. It requires login and the user
must have admin/owner permissions
2
* New feature

21. Resources

22. ● It's an abstract entity that represents one
request for an epidemiological resource
● It's composed by the request datastream
which has the same structure of Resource's
Metadata
Requests

23. Inwards: Requests
. Failed Search Results Suggestion box with requests in a search result
page
. Create Request Redirect after creating a request
. My Requests Reserved area to access all my requests,
those which I'm the owner
. Resource page Requests related with a resource (fulfilled
resources)
. Homepage Request listing box
. Search/List requests Search results by keyword, date
. Search engine search SEO and landing pages
. Twitter, Facebook,
Social media
Links from social networks
. Links from other
websites
Links from the epidemiological community

24. Outwards: Requests
. Share to social networks Share the request to social networks 3
. Follow Call for action: “Follow” this request. Login required 2
. Add a new comment Comments form 2
. Fulfill the request Link to the Process of pick or create a resource that meet the request 1
. Requested resources Link to access a resource associated with this request 2
. request Search (Browse) Link to filter requests by type, uploader, keyword/tag 1
. Edit/delete Call for action: change request elements. Login required and must be
the owner of the request
2
. Report abuse Call for action: report a resource that violates usage terms and
conditions
2

25. Request

26. ● The purpose is to have: clear and small
messages for users
● It's composed by message, author, date and
time, and also a "receiver" that could be a
multivalued field.
Announcements

27. Inwards: Announcements
. Homepage Announcements listing box
. announcement page Announcements listing box
. list announcements Announcements listing
. Search engine search SEO and landing pages
. Twitter, Facebook,
Social media
Links from social networks

28. Outwards: Announcements
. Internal Link Link for a site internal page 2
. External Link Link for a external page 2
. User profile Link for the user profile 1

29. Announcement

30. ● The purpose it's to have all service's
description in a single page
● It should include usage examples, and must
have a comment section for users to
contribute or participate
Webservices

31. Inwards: Webservices
. Resources Webservice promotion area in Resource page
. Developers/API Overall API presentation page
. Search Engine SEO and landing pages
. Twitter, Facebook,
Social media
Links from social networks

32. Outwards: Webservices
. Share to social networks Share the webservice to social networks 2
. Questions or general
documentation
2
<tag> Link to a filtering page for a tag keyword 1
Sign in Link to sign in form page 2
<version> Link to a filtering page for the version 1

33. Webservice

34. What are we think on doing
What?

35. ● Define new structure
● Design new mockups
● Find a new Designer
What

36. New structure
● User centered
○ Create new Developer's site- dev.epimarketplace.net
● Simple, Clear and Objective
● Keep Resources concept in the core
architecture

37. General navigation
Navigation

38. Navigation
Top
● Home
● Data (old: Browse)
● Participate (old: Upload, Request, Became a Curator)
● About
Footer
● Statistics
● Terms and conditions
● Developers
● Contact us

40. Mockups
● Resources + Search resources + Collections
(Resources group)?
● Request
● Webservice
● Homepage

41. Resources area
Resources

42. Resource View page

43. Resource View details Page

44. Simple and Familiar - first impression (microseconds) (http://googleresearch.blogspot.pt/2012/08/users-love-simple-and-familiar-
designs.html)

45. Description
Datasets
Metadata
Title
API

46. Description
Datasets
Metadata
Title
API

47. Resource - Mockup
Description
Datasets
Metadata
Title
API

48. Faceted filters

50. Reading from boxes

51. dados.gov.pt

52. data.gov.uk

54. Search Resources

55. Requests for resources
Requests

56. Request

57. Title

58. Request list
Title
Description/Teaser
Author
Followers +
Comments

59. item of the API
Webservice

61. Webservice

62. informational item
Announcements

63. message
photo
author
time

64. time
author
message

65. Announcements

66. Homepage

72. Too many focus problem

73. Resolution and visualization

74. Homepage - Mockup
Resources
search
Project
presentation
message
Resources
filters
requests
resources

75. Design and communication aspects
Design

76. Front-end roles
● Administrator
● Curator
● User
● Visitor

77. ● Main colors White + Grey + Black
● Gradients could be used
● Light grey Textures could be used
● Other colors
○ Red
■ if used, should be a light use
■ It's study that red color causes anxiety
Colors

78. Iconography
● Large buttons and text boxes could be used
● "Participate" item should be always promoted
● Each resource type should have an icon(https://www.epimarketplace.
net/resource/empid_2/download/datastream/EpidemicMarketplaceTypes_4350.ksh)
● Iconography should differentiate Resources from
Requests
● EM - the symbol that stands for "Epidemic
Marketplace". And should be used as the logo.

79. ● Should clearly states the project purpose
● Emphasise the search mechanisms
● By default, a resource type search will be
made (other types like request, collection,
should be available)
● After login, default homepage could be a list
all the announcements?
Homepage

80. Homepage - Message
M1: "CDC estimates about 60 million worldwide incidences of H1N1 on 2009
flu season, track here the dissemination" (Carlos Santos)
M2: "In 2009 there were 14,346 fatal cases of swine flu, we stored the data"
(http://flutracker.rhizalabs.com/)

81. ● Should be in clear place and always visible
● To memorize it, the standards should be
used
Login

82. The sign
up it's
hidden

83. 404 Page
● We don't want to waste visits
● This page should help user getting what he
is looking for
● Could have a playful effect