Interface Design Strategies for Data Portals esign Strategies for Data Portals

8/9/2019 Interface Design Strategies for Data Portals esign Strategies for Data Portals

1/24

ePSIplatform Topic Report No. 2015/01 , January 20151

!"#$%&'($ *$+!," +#%'#$,!$+ &-% *'#' .-%#'/+

$0123456 .0789: +4:;21 !6


2/24


!"#$%&'($ *$+!," +#%'#$,!$+ &-% *'#' .-%#'/+

"#$%& '( )'*+&*+,

M4LN21JDG >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

'7D;15:;C $P4:0;9H4 +0==51LG >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

? !6;12J0:;926 >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

O #F4 1284 2< 96;41>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

O>A (2=384P9;L >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

,4; 5N5L >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

#4:F69:58 ;41=96282EL >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

*26S; 96:80J4 D4:;926D >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

+9=389>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

VF5; L20 J26S; DF2N 9D 5D 9=321;56; 5D NF5; L20 DF2N >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

O>? /5L20; >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

X9D058 F94151:FL >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

Y04D;926 588 J4>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

V5D;4>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

$=715:4 ;F4 E19J >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> Z4 :514>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

O>O #L32E153FL >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

#L34 385LD 5 1284 >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

#L34>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

#L34>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

V47 ;L32E153F9: D;56J51JD >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

,4; 5 J4D9E641SD 5JH9:4 >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

O>\ ]D41 !6;41>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

%4J0:4 ;F4 60=741 2< D;43D >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

$>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

.85;>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

`483 ;4P; >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

$H41L 484=46; 9D 5 312=9D4 >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

O>B V47 #4:F6282E94D >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

.41=5896TD 56J 826E4H9;L >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>


3/24


!"#$%&'($ *$+!," +#%'#$,!$+ &-% *'#' .-%#'/+

!"#$%&'(# 514 :10:958 >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

+2:958 64;N21TD >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

.123194;51L ;4:F6282E94D HD> D;56J51JD >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

&2882N L201 =4;19:D ;2 D44 NF5; ;F4 312784= D32;D 96 L201 D9;4 >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> \ (26:80D926D 56J 14:2==46J5;926D >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

B %4>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

'720; ;F4 '0;F21D >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

(23L19EF; 96>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

"#$%&'()*

96;41


4/24


!"#$%&'($ *$+!," +#%'#$,!$+ &-% *'#' .-%#'/+

312H9J96E 5::4DD ;2 30789: 96


5/24


!"#$%&'($ *$+!," +#%'#$,!$+ &-% *'#' .-%#'/+

8 9:-'&(3/-4&:

#F4 ;51E4; 50J946:4 2< ;F9D 14321; :2=319D4D 56L264 NF2 =9EF; 74 14=2;48L 1485;4J ;2 ;F4

3856696E 2< 5 J5;5 321;58 N47 D9;4I 49;F41 9< ;F4L 514 =565E96E ;F4 312d4:; 21 96H28H4J 96 ;F4

;4:F69:58 9=384=46;5;926>

!; 9D 62; :2==26 ;2 `2N4H41I J4D9E6 :26:416D 20EF; ;2 V4 9J46;9


6/24


!"#$%&'($ *$+!," +#%'#$,!$+ &-% *'#' .-%#'/+

; #F9D ;F20EF; DF9#24-$

#F4 4DD46:4 2< J4D9E6 9D D28H96E ;F4 312784= 2< :2=384P9;L> #F9D :56 74 J264 7L F9J96E 21

=5T96E 9; D9=384 ;F120EF ;F4 0D4 2< 5 D4; 2< ;5:;9:D>

*5;575D4D 56J J5;5D4;D 514 96F4146;8L :2=384P 46;9;94Dh ;F414


7/24


!"#$%&'($ *$+!," +#%'#$,!$+ &-% *'#' .-%#'/+

)'/7%&;0+: 0, 0*+0/0-#+0*4 h 62 264 46d2LD ;F4 #F9D 9D 5 J4D9E6 9DD04G 0D41D F5H4 ;2 74 5DD014J

;F5; ;F4 :26;46; 2< 5 J5;5 321;58 9D 145J5784 56J 06J41D;56J5784>

"4H41;F484DDI ;F414 514 D2=4 E464158

35;;416D ;2 J458 N9;F ;F9Dh ;F4 =2D; D;159EF;209#%&*+>

-#'74:&>&E$

-64 2< ;F4 851E4D; F01J84D ;2 96H9;96E ;F4 96;414D; 2< ;F4 E464158 30789: 96 30789: 96 #F9D 9D =5J4 N21D4 7L ;F4


8/24


!"#$%&'($ *$+!," +#%'#$,!$+ &-% *'#' .-%#'/+

74L26J ;F491 2N6 !< ;F414 9D6e; 5 i09:T

56DN41I ;F4 ;41= 644JD ;2 74 14$

o969=589D= 9D 5 F51J J4D9E6 533125:Fh ;F9D 74:50D4 D9=389

VF46 3856696E 21 14H94N96E ;F4 D;10:;014 2< 5 J5;5 321;58I 9; 9D N21;F :511L96E 20; ;F4 4P41:9D4

2< 5DT96E NFL 4H41L D96E84 484=46; 9D 96 ;F4 385:4 9; 9D> !< 5 D5;9D


9/24


!"#$%&'($ *$+!," +#%'#$,!$+ &-% *'#' .-%#'/+

=2=46; ;2 J9D:0DD 35E965;926> .5E965;926 14

I=.- $&3 (&:G- )=&% 4) .) 47C&'-.:- .) %=.- $&3 )=&%

$H41L H9D058 484=46; F5D 56 4


10/24


!"#$%&'($ *$+!," +#%'#$,!$+ &-% *'#' .-%#'/+

F9EF89EF;96E 4H41L;F96EI 62;F96E 9D F9EF89EF;4J>

!=321;56:4 DF208J ;F414


11/24


!"#$%&'($ *$+!," +#%'#$,!$+ &-% *'#' .-%#'/+

D96:4 ;F4 145J57989;L 2< ;4P; 9D E145;8L 5#7#:-)

&2882N96E ;F4 32D;014 2< i04D;92696E J4


12/24


!"#$%&'($ *$+!," +#%'#$,!$+ &-% *'#' .-%#'/+

J4D9E6 9D 264 2< ;F2D4I 56J ;F414eD 89;;84 145D26 ;2 ;1L 56J 96H46; 56 58;4165;9H4>

M# /.'#?3> %4-= '#N(#)4E:)

%4[J4D9E696E 5 321;58 9D 56 969;95;9H4 ;F5; DF208J 62; 74 ;5T46 89EF;8L> !J4588LI ;F4 J4D9E6 20EF;

;2 74 14H94N4J 14E08518LI N9;F ;F4 F483 2< 0D57989;L ;4D;Dh F2N4H41I ;F9D N208J 14i0914 ;F4

314D46:4 2< 5 J4J9:5;4J J4D9E6 ;45=I NF9:F 9D D48J2= ;F4 :5D4 N9;F J5;5 321;58D>

#F414

;@; #

(2=30;41 D:1446D 514 5 H41L J9


13/24


!"#$%&'($ *$+!," +#%'#$,!$+ &-% *'#' .-%#'/+

;F414 9D ;F4 :26:416 ;2 J4


14/24


15/24


!"#$%&'($ *$+!," +#%'#$,!$+ &-% *'#' .-%#'/+

96

!6 21J41 ;2 5H29J


16/24


!"#$%&'($ *$+!," +#%'#$,!$+ &-% *'#' .-%#'/+

T>.-?&'7 4:(#C#:(#:/#

#2J5LI ;F414 9D 5 =08;9;0J4 2< J4H9:4DI NF9:F 342384 5::4DD 56J 712ND4 ;F4 !6;4164; ;F120EF>

&12= J4DT;23 :2=30;41D 56J 853;23D ;2 ;5784;DI D=51;3F264DI E5=4 :26D284D 21 #XDI ;F414 9D 5

H5D; H5195;926 2< D:1446 D9b4D> #F9D :145;4D 5 :26;4P;


17/24


!"#$%&'($ *$+!," +#%'#$,!$+ &-% *'#' .-%#'/+

E4;;96E #F4L =9EF; N19;4 4[=598D ;2 5DT

!6D;45JI ;F4L 20EF; ;2 74 =5J4 H9D9784 56J 312=2;4J ;2

#F9D N988 E2 5 826E N5L

96 #7#:- 4) . C'&74)#

]D41 96;41

$H41L 484=46; 96 5 N47D9;4 2H41 ;F4 NF9:F L20 :56 341


18/24


!"#$%&'($ *$+!," +#%'#$,!$+ &-% *'#' .-%#'/+

D07=9;;4J 96 5 N47D9;4I 74 9; ;F120EF 5 :26;5:; #F9D N988 46D014 ;F5; 20;D9J4 D201:4D NF2 i02;4 21 0D4

;F4 N47D9;4 N988 :26;9604 ;2 N21T> -;F41N9D4I 1484H56; :2664:;926D :56 74 82D; 56J =56L

9=321;56; J2:0=46;D 82D4 ;F491 ;1598 96 ;F4 312:4DD> #F4 74D; 1084 2< ;F0=7 9D ;2 ;145; 896TD 5D

341=5646; 46;9;94D ;F5; :5662; :F56E4h 9< 5 :F56E4 9D 14i0914JI 5 D34:9589D4J ;4:F69:58 4P341;

644JD ;2 74 314D46; ;2 ;5T4 :514 2< ;F4 =9E15;926 9DD04D ;F5; N988 519D4>

!"#$%&'(# .'# /'3/4.>

' :2==26 2::01146:4 96 96D;9;0;92658 N47D9;4D 56J 321;58D 9D ;F4 644J ;2 96:80J4 ;F4 000 96

;F4 ]%/I #F4 314


19/24


!"#$%&'($ *$+!," +#%'#$,!$+ &-% *'#' .-%#'/+

351;9:0851 65;014 2< ;F4D4 D07d4:;D ;F9D 9D 62; ;F4 T96J 2< ;5DT ;F5; :56 74 5::0=085;4J 7L 5

J4D9E641 70; DF208J 96D;45J 74 ;F4 D284 2::035;926 2< 5 312

`2N4H41I 9; 9D 06N9D4 ;2 4P5EE415;4 ;F4 D2:958 64;N21T 56E84I 84D; ;F4 321;58 74:2=4 56 06359J

5JH41;9D4=46;

/96TD 56J :2664:;926D ;2 ;F4= DF208J 74 385:4J NF414 9; =5;;41DG 9; 9D 5::43;5784 56J

46:2015E4J ;2 F5H4 j+F514j 70;;26DI 70; 84DD D2 ;2 F5H4 5 D9b5784 756641 96 ;F4 &E4#) 5)@ )-.:(.'()

#F414 514 =56L ,9H46 ;F9D D:465192I ;F4 i04D;

V4 N988 62; 31232D4 56L 351;9:0851 D280;926I 5D 45:F J5;5 321;58 N988 F5H4 J9


20/24


!"#$%&'($ *$+!," +#%'#$,!$+ &-% *'#' .-%#'/+

W&>>&% $&3' 7#-'4/) -& )## %=.- -=# C'&,>#7 )C&-) 4: $&3' )4-#

]D96E D9;4 5658L;9:D 9D 5 :2==26 D46D4 =2H4 96 =2J416 V47 J4H4823=46;> ]6J41D;56J96E ;F4

35;FD ;F5; 0D41D ;5T4 ;F120EF ;F4 D9;4 :56 74 T4L 96 3963296;96E D;0=7896E 782:TD 96 ;F4 D9;4SD

D;10:;014> !; 9D N21;F J4H2;96E 14D201:4D ;2 5658LD96E 5 321;58SD =4;19:D 96 21J41 ;2


21/24


!"#$%&'($ *$+!," +#%'#$,!$+ &-% *'#' .-%#'/+

O B&:/>3)4&:) .:( '#/&77#:(.-4&:)

*5;5 321;58D 514 D34:9 'JJ9;926588LI F5H96E 5 341D26

D43515;4


22/24


!"#$%&'($ *$+!," +#%'#$,!$+ &-% *'#' .-%#'/+

=9D;5T4c>"1& -#+# *&&-, +' $& .-: #+ %#2*318 61&., +1& -&,04* 3#* $& 0/7.'9&- #, :'2

4' >

#F4D4 514 d0D; 3296;41D 96;2 F2N J4D9E6 3196:9384D :56 74 :26D9J414J 96 ;F4 E258 2< 312H9J96E 56

96;41 &126;[46J J4D9E6 :56 74 5 H41L D;126E

;228 96 ;01696E 5 D9=384 J5;5 D41H9:4 96;2 5 1484H56; 56J 5;;15:;9H4 14D201:4 ;F5; :56 74 0D4J 7L

50J946:4D ;F5; L20 N208J6S; 4H46 :26D9J41 96 ;F4


23/24


!"#$%&'($ *$+!," +#%'#$,!$+ &-% *'#' .-%#'/+

V Q#?#'#:/#) .:( '#)&3'/#)

#L32E153FLG

' /9D; '351; 9D 5 N47 56J 3196;4J 30789:5;926 ;F5; D34:9589D4D 96 N47 56J 96;41F;;3GCCNNN>589D;5351;>:2=C;239:DCJ4D9E6C;L32E153FL

4$(%56'+7)% 9$:)# ;*.& # ?$-:)# 0'@, 4$(%56'+7)% 9"=) ;*.& A..B:) ?.(@# 9D 56

96D39196E DF2N:5D4 92CE22E84[;L34

,22E84 &26;D 312H9J4D 359196ED D0EE4D;926D 96 ;F4 96J9H9J058 +44 56 4P5=384

E22E84>:2=C


24/24

!"#$%&'($ *$+!," +#%'#$,!$+ &-% *'#' .-%#'/+

+,&3- -=# +3-=&')

E*# L,#$&% )#.9#%1' 56J M03#.-' N#(2&*+& 514 J4D9E6 56J 96;41

Documents

Interface Design Strategies for Data Portals esign Strategies for Data Portals