The concept underlying travelyet is to create a platform that provides a precise overview of the trendiest and other prominent travel destinations. In today's world, individuals seek rapid insights into travel opportunities. The issue that Travelyet.com aims to address is the overwhelming inundation of information pertaining to diverse travel destinations, structured and presented with precision. Through the website, users can educate themselves about the travel destination. Via experience blogs, tips and tricks blogs, or even reviews about the travel destination, users can swiftly and accurately inform themselves. The platform also collaborates with an affiliate program. travelyet offers the opportunity to book travel directly through the partner, Booking.com. Users can book a trip directly after they have educated themselves. The customization of the travel experience is possible.
In the future, travelyet.com intends to introduce an Ambassador Program, where users can enroll. In this program, users can monetize their experiences and generate income. They can present and monetize their experiences through blogs or vlogs.
In the near future, an e-commerce function is also set to be implemented. In addition to the service, physical products will be offered for sale.
The target audience for travelyet is diverse. Anyone with an interest in travel can use the website. While there is no specific restriction to a single target audience, various audience segments can be identified. The younger generation has different preferences for travel destinations compared to the older generation.
The design strategy is to create a modern and simplistic website, aiming to provide a straightforward and expedient user experience. The website should not appear cluttered, allowing users to navigate quickly and effortlessly.
View travelyet.com live project here
Travelyet redefines travel planning with a clear, concise platform, connecting you effortlessly to the world's trendiest destinations. Discover, learn, and book your next adventure through our partnership with Booking.com, all in one streamlined experience. Our future holds exciting opportunities, like the Travelyet Ambassador Program, allowing you to share and monetize your travel stories. As we evolve, look out for our e-commerce feature, enhancing your journey with essential travel products. Designed for ease, our modern, simplistic website caters to every traveler's need, ensuring your journey to discovery is just a few clicks away. Welcome to Travelyet – where every journey starts with clarity and ends with unforgettable experiences.
-
First-time visitor goals
- Understand the main purpose of the site and learn more about the Lunar Escape company.
- Easily navigate throughout the site.
- Find the Offers and informations on the website.
-
Returning visitor goals
- Find out information about new destination.
- Find the best way to get in contact with the company with any questions they may have.
- Finding new offers.
-
Frequent user goals
- Check if there are any new destination with new offers.
- Review the comments form the travelyet.com ambassador.
- This website is targeting people who want to travel.
- They can navigate and search for the best destination.
- Responsive on all device sizes.
- Navigation bar
- It is featured and fixed on all three pages and the form-received page.
- Includes links to the logo, home page, explore Bali, and contact page.
- It is identical in design across the pages.
- Hero section
- It is composed of a background image featuring a picture of a desert-landscape.
- Hero section, which is unique for landigpage:
- The home page is comprised of "Explore the world"
- Subtext, which explain the purpose of the website.
- Button, which allows the user to navigate to the "Explore Bali" page.
- Section one, Information and Service Grid
- This section contains a description of services.
- It gives us a brief description of what the user can expect form travelyet.
- Section two, Process of booking
- This section is valuable to the user as it gives them an easy understanding of the process of booking a vacation.
- Section three, About destination cards
- This section is valuable to the user as it gives them an easy understanding of the destination.
- It is designed in a card format to allow the user to easily navigate through the destinations.
- Section four, Booking.com partner section
- User get the oppurtunity to book a trip directly after they have educated themselves.
- The customization of the travel experience is possible.
- Booking.com is a partner of travelyet.com.
- Section five, Contact section
- The gallery will provide the user with supporting images to see shuttle launches, flights, and astronauts.
- This section is valuable to the user as they will see our previous flights and astronauts on the Moon.
- Travelyet ambassador section
- The travelyet ambassador section allows the user to see the most recent ambassador and their experience.
- Accordion-container and offers section
- The accordion-container allows the user to see the most frequently asked questions.
- The offers section allows the user to see the most recent offers.
- Contact Form
- The contact form allows the user to send a message to the company.
- Additional destinations and offers.
- Updated websites into a eCommerce website.
- Add a blog section.
-
Colour Scheme
- Primary colors used on the website:
- Primary colors used on the website:
-
Typography
- Inter font is main font used throughout the ite with sans-serif as its fallback font in case Inter doesn't import for some reasson.
-
Wireframes
- Used Figma to create wireframes for the website.
- Visual Studio Code
- To write the code.
- Git
- for vesion control.
- Github
- Deployment of the website and storing the files online.
- Google Fonts
- Import main font the website.
- Am I Responsive
- Mockup picture for the README file.
The W3C Markup Validator and W3C CSS Validator services were used to validate every page of the project to ensure there were no errors.
index.html
explorebali.html
contactus.html
contact.css
style.css
explore.css
- The website was tested on Google Chrome, Microsoft Edge, and Opera browsers.
- The website was viewed on a desktop computer, laptop, and Samsung Galaxy A52 mobile phone.
- A large amount of testing was done to ensure links between pages are working correctly on all pages.
- Family and friends were asked to review the website for a better understanding of the user experience.
- Dev Tools was used to test how the site looks on various screen sizes.
GitHub Pages used to deploy live version of the website.
- Log in to GitHub and locate GitHub Repository travelyet.com
- At the top of the Repository(not the main navigation) locate "Settings" button on the menu.
- Scroll down the Settings page until you locate "GitHub Pages".
- Under "Source", click the dropdown menu "None" and select "Main" and click "Save".
- The page will automatically refresh.
- Scroll back to locate the now-published site link in the "GitHub Pages" section.
By forking the repository, we make a copy of the original repository on our GitHub account to view and change without affecting the original repository by using these steps:
- Log in to GitHub and locate GitHub Repository travelyet.com
- At the top of the Repository(under the main navigation) locate "Fork" button.
- Now you should have a copy of the original repository in your GitHub account.
- Log in to GitHub and locate GitHub Repository travelyet.com
- Under the repository name click "Clone or download"
- Click on the code button, select clone with HTTPS, SSH or GitHub CLI and copy the link shown.
- Open Git Bash
- Change the current working directory to the location where you want the cloned directory to be made.
- Type
git cloneand then paste The URL copied in the step 3. - Press Enter and your local clone will be created.
- The README template was helpfully provided by Code Institute (template)
- Use dfferent tutorials on Youtube
- Kevin Powell (https://www.youtube.com/watch?v=rg7Fvvl3taU&t=1376s&ab_channel=KevinPowell)
- Slaying the Dragon (https://www.youtube.com/watch?v=phWxA89Dy94&ab_channel=SlayingTheDragon)
- All content was written by the developer.
- My mentor Mitko Bachvarov provided helpful feedback and a link to the Flexbox guide.
- Slack community for encouragement and information.