association of tour guides "mihovil" sibenik

Date released: 2020

requirements

build a web app where association members can register on the website and manage their profiles, writing blog and article posts, and handle billing through a single, user-friendly system.

Add user roles, moderator and admin, where moderators can edit and publish posts and admins can handle invoices, contracts and activate users, granting permissions and updating some parts of users profiles.

some of the required features

  • registration: users can register on the website, but accounts are not activated until they confirm their email address and are approved by an admin
  • login: users can log in using their email and password, and have the option to recover their password if they forget it
  • creating posts: add the ability to create blog and article posts with images, videos and documents. Uers can edit and delete posts
  • invoices & contracts: users can create invoices and contracts and download in .pdf and reuplad signed contracts
  • profile management: users can edit their profile, including changing their email address, phone number, and password, descriptions, etc
  • user roles: users can have different roles, including "moderator" and "admin", where moderators can edit and publish posts and admins can handle invoices, contracts and activate users, granting permissions
  • members page: a page with a list of association members and their profiles, has top be in random order every time on opening, add the ability to search for members, filter based on members licences and languages, and view the member's profile
  • contact forms: add the ability to send contact forms to the association and users, and add spam protection
  • design: create a fully responsive and user-friendly web design
  • translations: add support for multiple languages, but not for the entire website

let's get our hands dirty

purpose and goals

purpose:

  • make the local community and travel agencies more aware of the association and its activities
  • make local guides more aware of the association and its activities
  • promote the association and its members

goals:

  • make local tour guides join the association
  • get local tour agencies to contact members

sitemap and wireframing

vodici sibenik sitemap sketch

one of the first sitemap sketches

vodici sibenik wireframe sketch of the home page

first homepgae wireframe sketch

stack

  • mysql
  • laravel
  • livewire
  • tailwind
  • alpine.js
  • vps

style guides

font

the font for the site is the same is in the logo, nunito a well balanced highly-readable sans-serif typeface.

color palette

primary color: #fb923c

secondary color: #111827

text color: #111827

background color: #f3f4f6

buttons

primary button
secondary button

result

Laptop
screenshot of vodici sibenik website on widescreen
Laptop
screenshot of vodici sibenik website on widescreen

search results

it is all for nothing if no one can find you on google, so here are some of the keyword scores. here are some of the search scores using incognito mode

google search results for sibenik vodic keyword

search result for "šibenik vodiči". first result

google search results for sibenik tour guide keyword

search result for "sibenik tour guide". it scores second after the paid results

list of keyword average positions

some of the keyword average positions

review