Criterion E: Product Development

Use of Advance Techniques

Website Design Structure

Integration of components using advanced features from other application

The contact page tab of the website has a Google Maps by embedding the HTML code. This was
done by copying the HTML code and then embedding it by pasting it into the website.

This is a picture of where the HTML code was pasted, in order for the map to be embedded.
(Tutorial Source:
https://support.google.com/maps/answer/144361?co=GENIE.Platform%3DDesktop&hl=en​ )
Manipulation of Graphics
In order to change the pictures used in the website, the photo-editing software Gimp was used.
GIMP is a free alternative to Photoshop, it is an open-source raster graphics editor used for
image retouching and editing. It has a similar layout to Photoshop. It was used in order to fix
minor issues with the photographs such as excess around the edges and perspective issues. The
pictures would provide an inside look into the church.
Example of Manipulated Image:

Image Manipulation Process:

- Use the ‘ Brightness and Contrast’ tool to make the image more vivid
- Use the ‘ Crop’ tool to remove the excess background around the picture
- Use the ‘Perspective’ to fix the perspective of the image, so it is consistent
- Save and export the image as a .jpeg file.
Brightness and Contrast were adjusted to make the image more vivid.
Image after it was cropped
Use the tool to fix the perspective of the image since it was not captured the right way when
taken with the camera
How the image was exported
(Tutorial Source: ​https://www.youtube.com/watch?v=Q8C0LJPpr64​ )
Creating a Navigation Menu
In order to make the website easy to navigate, the menu was created. It also easy access to any
part or the website no matter what page the user is on.

The navigation page was created by using the ‘add page’ button, the pages were then organized
in order to put them in the right order for the navigation menu.

Picture of the navigation menu featured on the website. The website has a rollover text feature,
where when the mouse is on the text it turns blue.
Proficient integration of different elements
To show potential members everything that the church has to offer, the websites has many
different elements: pictures, multimedia, and videos. They have been integrated in almost every
page of the website.

In order to add different elements, the button used is ‘+’ or the ‘add’ button
It will then take you to the page above where you choose the folder you want to get an image
Many of the images are featured in slideshows, such as the one pictured above or individually.
Additional Information:
Security: The photos and videos used in the website were saved in Google Photos as well as on a
flash drive. This allowed for the photos and media to be secure and accessed from different
places.