Interactive Infographic for the Enterprise Business Architecture Framework

[MeaghanRStewart]

Background

The Architecture, Standards and Planning Branch within the OCIO is looking to build an interactive Enterprise Business Architecture scoring framework.

A prototype of the online infographic has been developed, which demonstrates basic functionality it can be found Here

User Story

As a government program owner I need to assess my alignment to the business and technology directives of government. In order to do this I need to have a way to score my initiative against the Enterprise Business Architecture Framework.

Acceptance Criteria

Develop a launch-ready online version of the OCIO Enterprise Business Architecture Framework. The interactive-infographic should replicate as closely as possible the provided diagram, and all of the relevant elements in the diagram should be interactive, and content can begin to get populated. See this [wireframe] () that illustrates how the interactive infographic might be structured.

The MVP should make all of the relevant elements in the diagram interactive (e.g. bootstrap jQuery plugins: accordion, popovers, video, etc...). The MVP should also be made aesthetically appealing and visually similar to the latest diagram provided. Some exceptions are expected and the developer should communicate any recommended changes that would improve the online experience (e.g. the developer can ignore/remove the 3 vertical columns on the left side of the diagram). Dummy text content can be used where required and government staff can update the content after the issue is closed.

1. Allow the insertion and deletion of content boxes (i.e. rows, see wireframe).
2. Allow the insertion and deletion of content elements (i.e. see wireframe).
3. Content box should have the ability to contain multiple content elements that scale according to the number of content elements.
4. Allow the insertion and deletion of graphics (and perhaps text) into the content elements.
5. When a user clicks on a content element (every row, or content box, should have this capability), an accordion window will expand/appear underneath. This second diagram illustrates how a user might interact with the infographic.
6. Allow the insertion and deletion of content in accordion windows, including text and hyperlinks (possibly graphics).
7. Support vector graphics. You can use example graphics and text for the prototype.
8. Provide the final product in a format that can be run on any computer (localhost) through any modern web-browser.
9. Device agnostic and responsive.
10. Use of commonly known, open web frameworks

This is to be an updated version of the original document.

How to Contribute

We are offering this issue as a paid opportunity through our experimental procurement model, Code-with-Us.

To work on this issue, we are accepting proposals until 12:00:00 PST on December 21, 2016. After that time, we will evaluate the proposals we’ve received, and assign the work to one person by Friday, December 23, 2016. (How assignment works)

What To Include In Your Proposal

We will evaluate and score proposals by the following criteria:

• Your ability to dedicate the time needed to complete the issue by January 10, 2017(Mandatory).
• The estimated date you think you can show us your first iteration (Mandatory).
• A short (no more than 200 words) summary of your proposed approach (60 points).
• References to your relevant experience and demonstrated ability to do the work (40 points). For example, a link to your GitHub projects.
• With your proposal, you must attach a copy of the Code-with-Us Terms, with the required information asked for in the “Acceptance” section of the Terms inserted into the document (Mandatory).
• The highest scoring proposal will get the assignment.

How To Submit Your Proposal

Please submit your proposal to Stephen.Gidden@gov.bc.ca before 12:00:00 PST on December 21, 2016. Please put "Interactive Infographic for the Enterprise Business Architecture Framework" in the subject line.

[Filoni]

Do you have image files available for the graphics used in the document?

[MeaghanRStewart]

Hello @Filoni , We have a new image provided by Queens Printer, they will format it as an .svg file and upload it to the repository before we go live with the "Code With Us" .

[Filoni]

Do you have any other image files though? Ones for the icons used in the SVG document, etc?

[MeaghanRStewart]

Hello @Filoni , We have not received the documentation from Queens Printer as of yet, we will add as the opportunity goes "live". Currently we are preparing the opportunity and have not received all of the docs and acceptance criteria from the program owner.

[Filoni]

Ah I gotcha! Didn't realize!