TTTTZ2553

WEB DEVELOPMENT
APPLICATION
TASK 2
Group members : Leong Sin Wei
A151144
Ting Ning
A151102
Ooi Kah Yen
A150873

Lecturer : Puan JUNAIDAH BINTI MOHAMED

KASSIM
Flowchart :

Database design sample :

Field

Type

Example

username

varchar
(30)
varchar
(30)
varchar
(50)

Alicetan95

password
email

9864572310tan
Alicetan@gmail.com

Sample of colour scheme for background:

Light grey (#EDEDE2) , white colour (#FFFFFF) or light beige

(#FAF5E1) is preferred because we tend to make the website looks
simple and professional. Moreover, the light colour will not drag out the
focus of our audience from viewing the photo uploaded.

Font-style sample :

520Pixel
520Pixel
520Pixel
520Pixel

(Bodoni MT)

(Georgia)

(Gill Sans MT )

(Franklin Gothic Book)

The font style above are artsy and readable easily. Users will feel
comfortable and willing to continue to view our website as the font is
easily to read and understandable.
Each character are more distinct in Serif fonts (Bodoni MT, Georgia),
thus they are effective as headings and main body text. While the Sans
serif fonts (Gill Sans MT, Franklin Gothic Book) are simple and
straightforward, makes them easier to read on computers, thus
suitable to use in footer text.

Font-colour sample:

Black (#000000), dark grey (#15141C) and dark blue (#011533) will
be the top choice for font colour. This is to ensure the font is contrast
with background colour. Those dark colours also seems neat and tidy in
presentation. Users can read the text more easily and comfortable.

Logo design sample:

Camera icon will be the logo of our website, presenting photography

website. The design of the logo is simple and easily recognizable.
Yellow and baby blue colour are candidates for the colour of the logo.
Yellow able to attract the attention of users and it represents a fun and
young spirit. While baby blue colour represent the feeling of calm and
serene, thus users will feel more comfort if the baby blue colour
applied.

Banner design sample:

Compare to logo design, banner design are more flexible such as using
a landscape view besides image of a camera lens. The logo and title of
the website are insert into the banner, introduce and alert the users
regarding landing on our website.

Button design sample:

General button:
(#00FF96)

Colour - Sea Blue (##3498DB)and Mint green

Style Large, wide and rounded rectangle in shape to
grab attention of viewers.

Sign in button:
(#BA1766)

Colour -FacebookBlue (#5B74A8) and Magneta

Style Rounded rectangle in shape, smaller and
compact compare to general button.

Share button :
(#FFFA7C)

Colour - Rose pink (#00FF96) and light yellow

Style Long and half sphere at both left and right

side.

Search bar design sample:

The search bar is design in simple style. The search button is using the
style of general button as mentioned, with default text field.

Meanwhile, the template of a more stylish search toolbar can be found

online.

Sample of the interface:

Home page-

Category (same page under Home) -

Photo gallery (after click on one of the category)

Explore -

About -

Contact -