1. Biblioteca Project Wireframe/Mockups Version 2

2.  These are hybrid mockups…a combination of wireframe and mockup. For this reason, alignment may not be perfect in the examples, but will be in the final design  Documents are located by applying successive levels of filters. As each filter is applied, any document not within the selected topic or sub-topic is filtered out of the display  Documents may also be located using the search box. As the user types, documents with the combination of letters as they are entered are returned, thus as you type “Metodología” each successive letter narrows the results to only those titles with words that contain the letter combination, e.g.:  M: mecanismos, mejoramiento, metodologías, medios, diagrames, desempeño, documentales  ME: mecanismos, mejoramiento, metodologías, medios, diagrames, documentales  MET: metodologías Biblioteca Project General Notes

3. Biblioteca Landing Page: Not logged in Notes: All users will login to use the library. If a user doesn’t already have a users name and password the will follow the link to register with the site.

4. Biblioteca Landing Page: Post login Notes: Once the user logs in the welcome and logout links in the upper right corner. The search box immediately filters results by any name in a resource title as you type. Combined with the filtering system, this is a more powerful approach than keywords.

5. Sample: Level 1 Reorganización institucional Notes: Once a user selects a main category, all documents for that category are returned. Each successive choice further filters the results.

6. Sample: Level 2 Reorganización institucional Notes: This example shows the results when one of the first three sub-filters is selected. Sub-filters are displayed only documents that fall under that filter are returned. Representative Icon…please see final versions

7. Sample: Level 3 Reorganización institucional Notes: This example shows the results when the third level of filters is applied. Only the document s for that specific level are displayed. Representative Icon…please see final versions

8. Document titles and description Notes: Ideally, the resource title will be more descriptive than the resource file name Sample of recommended approach to document titles and descriptions Resource behavior:  When a user clicks the title of a document (e.g., a PDF) the document will open in a new window.  Standard document controls will apply, so a user may save or print a document  Video files will also appear in a new window. If desired, the link can be a direct link to the video on SETEC’s YouTube channel or the YouTube video can be embedded in a page with styling similar to the site

9. How to organize documents for import Best practice outlined below. To add the documents into the CMS, we’ll need first to have the documents organized according to the taxonomy. Many clients choose to list documents in a spreadsheet which includes:  The actual file name, e.g.: MetodologíaMejoramiento-Chihuahua.pdf.  A user-friendly display name, e.g.: Metodología de Mejoramiento del Desempeño Para Fiscalía en el Estado de Chihuahua  An optional Description: The description is useful to help users know more about the document before selecting it. It’s best if use is consistent: either use descriptions for most resources, or don’t use descriptions for any.  Most clients also organize documents within folders or zip files indicating where the resources fit in the structure, e.g.,: Difusión-Campañas-Documentales