acp fish ii - welcome

"Strengthening Fisheries Management in ACP Countries"

Project Funded by the European Union.

“This publication has been produced with the assistance of the European Union. The contents of this publication are the sole responsibility of ”name of the author” and can in no way be taken to reflect the views of the European Union.”

“The content of this document does not necessarily reflect the views of the concerned governments.”

Final Technical Report

"Design and Development of a website for CODOPESCA"

Project ref. N° CAR-1.2-B2a2

Region: Caribbean

Country: Dominican Republic

Date: July 15, 2013

A project implemented by:

Design and Development of a website for CODOPESCA

Project Funded by the European Union A project implemented by EXITO pg. 2

Table of contents

List of tables, figures and photographs ................................................................................ 3

List of annexes...................................................................................................................... 4

Acknowledgements............................................................................................................... 5

Abbreviations and acronyms................................................................................................. 6

Executive Summary ............................................................................................................. 7

1 Background ...................................................................................................................... 8

2 Approach to the assignment ........................................................................................... 9

3 Comments on Terms of References ............................................................................... 10

4 Organization and Methodology ...................................................................................... 11

4.a Delivery of Terms of Reference ..................................................................................... 11

4.b Conduct and details of the assignment including visibility activities

Renewed Graphic identity .............................................................................................. 13

Domain Name and Server set up ................................................................................... 13

Email Accounts creation ................................................................................................ 13

Original and suitable web design ................................................................................... 14

Interactive location map ................................................................................................. 17

Social network building ................................................................................................ 17

Web site translation ....................................................................................................... 18

Content Management System ........................................................................................ 18

User-friendly Back Office .............................................................................................. 18

Legal matters .................................................................................................................. 19

Browser tests and Security controls ............................................................................... 20

Mobile version ............................................................................................................... 20

Intranet ........................................................................................................................... 20

Training Workshops ....................................................................................................... 21

Press Release .................................................................................................................. 23

5 Conclusions and Recommendations .............................................................................. 24



List of tables, figures and photographs

Figure 1 - Codopesca’s Logo ............................................................................................... 13

Figure 2 - Home page Layout .............................................................................................. 14

Figure 3 - Article layout ....................................................................................................... 15

Figure 4 - Home page design ............................................................................................... 16

Figure 5 - Article Design ...................................................................................................... 16

Figure 6 - Interactive Map .................................................................................................... 17

Figure 7 - Social networks .................................................................................................... 17

Figure 8 - Website translation .............................................................................................. 18

Figure 9 - Back office: control panel ................................................................................... 18

Figure 10 - Back office: article manager .............................................................................. 19

Figure 11 - Participants in the first training session.............................................................. 21

Figure 12 - Participants in the second training session......................................................... 22

Figure 13 - Participants in the third training session............................................................. 22

Figure 13 – Official picture for press release ....................................................................... 23



List of annexes

Annex 1 • Content Organization

Annex 2 • Optic Guidelines and Rules (guidelines for websites of the Dominican Republic)

Annex 3 • Records of Landing and Fishing Settlements

Annex 4 • Web site Administrator Manual

Annex 5 • Intranet User Manual

Annex 6 • Terms of Reference

Annex 7 • Inception Report

Annex 8 • Press Release

Annex 9 • Trainings forms



Acknowledgements

We would like to express our thanks to the ACP Fish II Coordination Unit in Brussels,

through Mr. Gustavo Miranda and Mrs. Cristina González. They provided us with all the

necessary contract documentation and were very attentive and available to answer all

administrative queries.

We would like to thank the program’s Regional Manager based in Belize City, Mrs. Sandra

Grant. Without her constant guidance and support, the project would not have run as smoothly

as it did.

We would also like to thank all the employees of CODOPESCA who collaborated with us, for

their time and efforts in helping us put together this project.

A special thank to Mrs Jeannette Mateo, Director of Fisheries Resources, for her involvement,

her wholehearted availability and support throughout both design and development phase. She

made sure we were given all necessary documentation and resources to create the web site

contents. She was very dedicated in organizing and coordinating all trainings workshops with

internal staff of both headquarters and regional Offices.



Abbreviations and acronyms

CMS Content Manager System

CSS Cascading Style Sheet

CODOPESCA Consejo Dominicano de Pesca y Acuicultura

D.R. Dominican Republic

OPTIC Oficina Presidencial de Tecnologías de la Información y Comunicación

de la República Dominicana



Executive Summary

The contract “Design and Development of a website for CODOPESCA” with identification

number CAR-1.2-B2a2” was awarded to Exito, Creaciones y Estrategias Publicitarias S.R.L.

on March 19th, 2013.

After meeting with CODOPESCA’s team and listening to their needs and aspirations, we

prepared an architecture proposal and we started working on the website design and the

development of two essential tools: the website and an intranet. We worked in full compliance

with the ToR and in close collaboration with CODOPESCA’s staff.

We included all the contents that CODOPESCA provided us with, such as texts, media files

and downloadable documents. We chose a content manager system that enabled an easy

update, offered the CODOPESCA managers training workshops and edited a complete

manual for intranet users.

After analyzing the different needs that were expressed, we opted for two distinct tools:

- A website (www.codopesca.gob.do) aimed at the general public and stakeholders. The

website is informative, interactive and includes key tools that will facilitate administrative

processes. It will also strengthen CODOPESCA’s corporate identity as the competent

authority in the field of fisheries and aquaculture in the Dominican Republic.

- An intranet with restricted access (www.intranet.codopesca.gob.do) for internal

communication. It includes a chat, a videoconference and a third module to share documents.

It also counts with an interactive form for Regional Offices to record local landing and fishing

settlements that automatically generate databases.

Throughout the project, we took into account all Dominican Government guidelines, security

requirements, legal links and we developed their website in full compliance with international

standards and protocols.

We provided the CODOPESCA managers with all the necessary training workshops to enable

them to be in charge of back office for future updates and maintenance. Another workshop

was aimed at Regional offices so their staff could learn how to use intranet tools. We edited

and handed out two thorough user manuals that will help both managers and users.

http://www.codopesca.gob.do/



Background

The Dominican Council for Fisheries and Aquaculture (CODOPESCA) is the institution with

legal power, administrative autonomy and independent budget in charge of regulating,

developing, promoting, monitoring and controlling fisheries and aquaculture activities in the

Dominican Republic. CODOPESCA has its headquarters in Santo Domingo and is present

throughout the Dominican Republic thanks to nine regional offices. CODOPESCA employs a

staff of around 15 central office technical officers, 90 enumerators and 30 technicians based in

the regional offices.

CODOPESCA is currently doing a considerable amount of work in fisheries and aquaculture;

however, very few of CODOPESCA’s actions and publications are made public due to

budgetary constraints. One of the proposed solutions identified by the Fisheries Authorities

(FA) stakeholders, as well as the consultants assigned to elaborating the fisheries and

aquaculture policy for the DR, was the urgent need to assist CODOPESCA in the designing of

a webpage as a tool for sharing data and information with its various stakeholders and

obtaining feedback from them.

Our main purpose was to create for CODOPESCA a modern and interactive website that will

promote its role and actions both within the Dominican Republic and in a more international

context.



Approach to the assignment

On April 23, 2013, we met with Mrs. Jeanette Mateo (Director of Fisheries Resources) our

contact at CODOPESCA. She was very collaborative and interested in our experience.

Together, we identified the various needs and requirements of the project and defined the

organization and prioritization CODOPESCA contents in sections and subsections. (Cf.

Annex 1).

She explained to us the various interactions between CODOPESCA and sector players and

insisted on the need within the website for an integrated module to facilitate both

communication (mail, chat or videoconference) and the exchange of documents between the 9

CODOPESCA regional offices.

Identified needs and audiences

For the general public, the website is informative thanks to:

content sections explaining clearly what CODOPESCA is, what is its legal status,

what service it provides, its activities and list of events ;

a documentation center enabling users to download a number of documents,

publications guidelines and statistics published by the organization.

For the sector players, the website is interactive with the idea to alleviate the administrative

burden and shorten the processing delays for both users and CODOPESCA. It counts with a

complete list of required documents for people who want to apply for a licence or a

certificate. We also set up a form for people asking for technical advice.

For CODOPESCA regional offices, the website is an effective communication tool thanks to

a restricted interface (Intranet) through which the 9 regional offices will be able to

communicate easily and share files. Until now, records of landing and fishing settlements

were listed in small notebooks by the Regional offices’ numerators. Once all pages of the

notebook were filled, it was sent to the Direction of Fisheries Resources to be entered into a

database for statistics consultation. We suggested an online form with an automatic

calculation to simplify this process.

For the CODOPESCA counterparts in ACP countries in the Caribbean, thanks to an automatic

script using Google Translate the website contents will be instantaneously available for the

non-Spanish speaking users.



Comments on the Terms of References

On April 16, 2013 a briefing was held with Mrs. Sandra Grant, Manager Regional Office -

ACP Fish II Programme.

We examined the Terms of references in details in particular the objective, purpose and

expected results, the scope of the work and the tasks specified and accept the logic of the

approach to the required activities. The general scope and target groups are well defined, so

that we are confident that we can provide the required services and documents to the highest

standards.



Organisation and Methodology

4a) Delivery of Terms of Reference

Requirements defined in the ToR How we met them

1 Meeting with ACP Fish II and CODOPESCA, the two

entities directly in charge of coordinating this project.

On April 16, 2013, meeting was held with Mrs. Sandra

Grant, Manager Regional Office - ACP Fish II

Programme

On April 23, 2013, we met with Mrs. Jeanette Mateo

(Director of Fisheries Resources) our contact at

CODOPESCA.

2 Consulting with CODOPESCA and other Government

Departments, outlining the programme and

overviewing of the webpage design taking into

account CODOPESCA visibility needs and

stakeholder requirements.

CODOPESCA provided us with a document issued by

the OPTIC (Presidential Office of Information and

Communication Technologies of the Dominican

Republic) that defines rules and guidelines for websites

of the Dominican Government. We carefully took into

account all the requirements during the design and

development of the website.

3 Design and development of the CODOPESCA

webpage:

Supported by the following browsers:

Smartphone web browsers, Firefox, Google

Chrome, Opera and Safari, Internet Explorer 7

and 8+. The website should be supported by PHP

Platform while the front-end will be developed in

HTML, CSS, JS and FLASH.

We used Joomla CMS (a Php plateform) and the front

end is done with Html and Cascading Style Sheet

(CSS). There are some Java Scripts and JQuery scripts.

We have run cross-browser tests successfully.

Compliant with security requirements, that is,

must be protected in such a way that only

authentic users have access to any content,

including HTML, images, videos and other media

and objects files. (HTML and FLASH APPS)

The whole website has been properly crawled and no

input or parameter left unchecked. Users need to log in

to access back office and intranet.

Ensure terms and conditions of the website shown

in all pages and accessible by placing a link in the

footer. Favicon icons are mandatory for the

project (before and after accessing the page). Both

icons should be aligned with the communication

roads and designing.

A dedicated menu was added in the footer, which is

permanent on all pages. It includes Terms &

Conditions, FAQ and Privacy Policy.

A favicon derived from CODOPESCA’s logo was

incorporated.

Ensure the concept is aligned with topics and

page designing. The concept should be clean,

aesthetic, concrete and easy to manage, with

design and colours related to the topics

We created an original and suitable interface for

CODOPESCA’s website.

Consideration should be given to the

implementation of the following application

modules for their interactivity: Content manager,

Module of user register, Administrative module,

Interactive photo gallery

We configured a back office for website’s managers.

Through it, they can easily update contents (texts,

images, documents to be downloaded), create new

articles, new photo galleries, new banners for the home

page slider. We designed an expandable menu that

allows new sections and subsections in the future.

We set up a user manager component that defines

various levels of permissions according to user profile.

It is easy to add a new user or to disable an existing

one.



Ensure modules are developed applying available

technology, adaptable to CODOPESCA’s needs

and to the available budget, to allow for good

results, such as multi-language support, visual

look professional and personalized, no limit in

changeable designing so that the web page always

remain modern and in agreement with actual

tendencies. Including PHP (PHP Hypertext Pre-

Processor); Adobe Flash /Action Script 3 / Java

Script / HTML / CSS / J QUERY; CMS (Content

Management System / Sistema Gestor de

Contenidos) Pay particular attention to the web

page quality standards (AL, norms W3C,

accessibility, yield / speed, compatibility), high

functionality (including information management,

interactivity and the value of online services),

limitless extensibility (to aggregate online

enquiries, calendars, newsletters, statistics reports,

directories, downloading managers, audio and

video galleries, etc.), multi-platform support,

security.

• A Google Translation script has been installed to

allow non-Spanish speaking users to get the website

contents instantaneously available in their own

language.

• Many modules and components are available in the

back-office with unlimited extensibility.

4 Test and confirm stability of webpage once the

designing and development is completed.

All tests were performed successfully.

5 In collaboration with CODOPESCA develop User and

Web Administration Manual for CODOPESCA

personnel on webpage optimal usage.

We delivered 2 manuals: a first one for back office

managers and the second one for Intranet users.

6 Print training documents in preparation for the

workshop;

A tutorial has been edited for back office users. It

details all the necessary steps for an update or a

creation. A printed version has been distributed to all

participants and a PDF version sent to their email.

7 With CODOPESCA’s assistance, facilitate, organize

and make all logistical arrangements for a 1-day

training workshop for users of the website and an

additional 1-2 days for on-the-job training for the

CODOPESCA officer in charge of maintaining the

website, including lunch, break, rental of computer

equipment and programmes, and training materials;

We set up 3 trainings session in total:

The first session, with 8 participants, on June 25th

with

the assistance of CODOPESCA’s Executive Director

and a representative of each department (human

resources, administration, communication and

statistics).

The second session was more in-depth and aimed at a

small group of 3 managers and 3 super users.

The third session was set up with 8 Regional Officers

to explain to them how to use Intranet tools.

8 Train at least 10 of CODOPESCA’s staff members; 17 members attended our trainings.

9 Test the website’s functionalities All tests were run successfully

10 Prepare and submit final report in accordance with the

ACP FISH II Programme guidelines.

Done



4b) Conduct and details of the assignment including visibility activities

Renewed graphical identity

We gave CODOPESCA’s graphic identity a new life while staying true to the original. With

new proportions, the new logo has a better presence and readability. It conveys

CODOPESCA’s key message and has a defining baseline. We have saved those files and

color schemes online for download, in a dedicated section called “Graphic Identity” so every

department or supplier may easily get acces to them. It. We also used the CODOPESCA

symbol as a marker in the location map to identify CODOPESCA’s Regional offices and as a

favicon that identifies CODOPESCA’s URL when bookmarked or appears in browser’s

history.

Domain name and server set up

We suggested a corporate domain name: www.codopesca.gob.do and assisted CODOPESCA

in registering their domain with the institution in charge of domain names in D.R (Nic.do).

We also assisted CODOPESCA in choosing an adequate and reliable server to install website

files. The domain name registration and server configuration were completed successfully.

Email accounts creation

We create 55 email accounts of the following type: [email protected] for

CODOPESCA’s employees. Users are registered in the Intranet. To simplify use, all users

have the same password for both, intranet and email access. They can access their emails in

the intranet or here: http://www.codopesca.gob.do/webmail.

We also provided them with a server URL in case they should configure their email account

in their email software (Outlook, Thunderbird, etc.) or in their smart phones.

http://www.codopesca.gob.do/

http://www.codopesca.gob.do/webmail



Original and suitable web design

During the conceptual phase, we opted for a right sidebar for main navigation, which is the

most appropriate structure in which to organize the web content of CODOPESCA. This

vertical menu allows addition of new sections and subsections in the future, without altering

the design.

We drew an overall blueprint including general navigation for the home page and a content

article. It helps visualizing how the various contents and elements will appear on the site and

how users will be able to navigate the site and easily access its content.

Home Page



On Tuesday 6th

of May, both layouts were presented, detailed and commented on to Mrs.

Jeanette Mateo who approved them.

We did not use any ready-made template, but created a custom, original and exclusive

interface for CODOPESCA’s website. It is inspired from its logo’s colors scheme and its

design is evocative of CODOPESCA’s sector and activities.

CODOPESCA provided us with a document issued by the OPTIC (Presidential Office of

Information and Communication Technologies of the Dominican Republic) that defines rules

and guidelines for websites of the Dominican Government. Although most of the required

elements are standards that we usually apply, we carefully considered them during the design

and development of the website. The OPTIC document is attached in annex # 2



Home page:

Content article:



Interactive location map

An interactive map was designed in order to locate and identify the Regional Offices. Users

need only to hover with the mouse to get Office’s address, phone number, email...

It is possible for CODOPESCA to enrich this map in the future with other data such as names,

location of fishing areas throughout the country, available fishes per area...

Social network building

We took into consideration the necessity for the website to interact with social networking

sites. We created social network links that lead to CODOPESCA accounts but also set up an

“Add this” button that allows visitors to share the content of the pages with their own

networks, or by e-mailing them to the recipients of their choice.



Web site translation

A Google Translation script has been installed to allow non-Spanish-speaking users to get the

website contents instantaneously available in their own language. For better visibility, we

placed it on the top right of the website.

Content Management System

For both, web site and intranet, we used Joomla 2.5.11 CMS (an open source Php platform)

and the front end is done with Html and Cascading Style Sheet (CSS). There are some Java

and JQuery scripts used for the slide show we placed in the home page and for the photo

gallery in Multimedia section.

We included all the contents we were supplied and delivered a complete and fully functional

website to CODOPESCA.

User-friendly back office



We set up a back office system for website managers. This tool will enable them to easily

update contents, create new articles, new photo galleries and new banners for the home page

slider. They can also easily add new sections or sub sections in the menu.

The content editor has an intuitive interface that is very similar to Microsoft Word. The whole

back-office is user-friendly and does not require any programming language knowledge.

We configured a user manager component that allows different levels of permissions

according to user profile. It is easy to add a new user or to disable an existing one.

A 20-page administrator manual (cf annex # 4) has been edited for back office managers. It

details all the steps to complete an update or a creation.

Legal matters

In the website footer, we placed a special menu with links to Terms of Use, Privacy Policy

and FAQ. Just above this line is the copyright information.



Browser tests and security controls

We ran multi-browser tests successfully: Firefox, Internet Explorer, Safari and Chrome.

Regarding security, the whole website has been properly crawled and all inputs as search and

newsletter boxes have been checked. Users need to login with individual password to access

back office and Intranet.

Mobile version

We prepared a specific version of the website for mobile devices so users can view the

content in full size, whatever the size of their screens. They still have the option to get back to

PC version for those who have more advanced mobiles.

Intranet

We decided to have an independent and dedicated platform for the intranet with an easy to

remember URL: http://www.intranet.codopesca.gob.do. However, we kept the website overall

design and color scheme and we placed a link from the intranet that leads to the website. We

set up the same CMS (Joomla) as for the web site to make things easy for managers.

We used open source modules and components for chat (ConnectChat) file sharing

(Remository) and videoconference (Mconf) that we configured and customized in agreement

with CODOPESCA’s needs and design.

We developed another important tool, the Records of Landing and Fishing Settlements, that is

meant primarily for the regional offices. It consists in 3 databases:

1 - Identification and location of the fisherman, type of vessel, landing site, weather, duration,

date, etc.

2 - Catch content with species classification and price per pound

3 - Detailed operational expenses and net income for the fisherman

All the data is automatically calculated by our implemented system. Cf annex 3

A User Manual was edited and handed out during training workshops. It is also available for

download on the Intranet. Cf. annex 5

http://www.intranet.codopesca.gob.do/



Training workshops

3 trainings workshops were held:

The first one, on June 25th

, with the assistance of CODOPESCA’s Executive Director, Mr.

Francisco Frías, and a representative of each department:

• Fisheries Resources: Mrs. Jeanette Mateo (Director), Mr. Estanislao Balbuena (Statistics

Manager) and Mr. Erick Nuñez,

• Human Resources: Mrs. Leonarda Villa,

• Administration and Financials: Mrs. María Bruján,

• Communication: Mrs. Luisa Valdez,

• Executive Direction: Mrs. Masai Rodriguez (Administrative assistant)

A printed version of the user manual has been handed out to all participants and a PDF

version has been sent to their email.

The second training workshop was held on July 2nd

with a small group to look more in

depth at the website administration. For security reasons, only two of them, Mr. Erick Nuñez

and Mr. Enmanuel Montero, have Super User status in both back-offices. The other

participants have Manager status, as their main activity will be to upload documents.

Mr. Estanislao Balbuena, as Statistics Manager, has access to the database generated from the

intranet form "Records of Landing and Fishing Settlement".

Mrs. Jeanette Mateo has all rights, even to create, cancel users or change their status.



The third training workshop was held on Thursday 4th

of July, we met with all Regional

Officers. We presented them the website and provided them with a complete training session

on the Intranet.

They seemed very enthusiastic with both the Internet site and the Intranet. They showed great

interest in the "Records of Landing and Fishing Settlement" form which they consider a very

efficient tool that will facilitate their daily tasks. We gave them the printed User Manual that

they can also find online, once logged into the Intranet. All participants had lunch together

after workshop.



Press Release

A press release written by Mr. Francisco Frías announcing the launch of the website was sent.

We enclosed some screen-shots and pictures to illustrate the article.

Cf. Annex 8

CODOPESCA’s staff, including three regional officers, during the launching day.



Conclusions and recommendations

We believe we have provided CODOPESCA with a website that gives the institution a

modern image and that strengthens its corporate identity. As the competent authority in the

field of fisheries and aquaculture in the Dominican Republic, it is crucial that CODOPESCA

appear as a legitimate, independent entity. Today CODOPESCA informs the general public,

communicates on its activities in a transparent manner, highlights its legal power and

facilitates administrative procedures for sector players.

Regarding the intranet, it will work as a transversal tool that will improve communication

between CODOPESCA’s employees and between Regional Offices and Headquarters in

Santo Domingo.

The form “Records of Landing and Fishing Settlements” seems a very effective tool that will

help CODOPESCA build reliable data on fisheries activity. To make the most of this tool, the

Regional Offices should all be equipped with computers and internet connections.

We encourage website administrators to:

1 - Proceed to a monthly update: Changing banners in the home page, adding news articles

and new incoming events in the Calendar

2 - Add the content that is yet to be included:

- Transparency - Purchases and hiring

- Transparency - Estate

3 - Update on a regular basis when new content appears: photo gallery, new convention,

new project or publication, new workshop etc.

We recommended CODOPESCA’s executives encourage their staff in using their new emails

and the intranet so they can quickly master these new tools.

We offered CODOPESCA 6-month administration assistance, free of charge, to help them get

started in the administration of both the website and the intranet.

acp fish ii - welcome

Documents