Skip to content

Redsskull/date-knight

Repository files navigation

screenshot

The Date Knight saving you from your boring dates!

A responsive web application designed to ignite the spark of romance and inspire unforgettable moments for couples by generating personalised date ideas.

UX

Colour Schemes

We have used coolors.co to generate our colour pallete. The selection of these colors was chosen to encapsulate the essence of Valentine's Day and evoke the emotions associated with a romantic date.

screenshot

Typography

We have chosen a sans-serif font to achieve a clean and streamlined appearance, enhancing readability. This choice also imbues a modern and contemporary feel, aligning with our design goals. By prioritizing readability, we aim to enhance accessibility and ensure a more inclusive user experience.

User Stories

New User

  • As a new user, I would like to be able to view the web application on many devices.
  • As a new user, I would like to be able to allocate a budget so I can have a budget-friendly date.
  • As a new user, I would like to have options in preferences so it's easier for me to use.
  • As a new user, I would like to have an identifiable logo for me to remember the site.

Frequent User

  • As a frequent user, I would like to be able to view social media links so that I can reach out when I need help.
  • As a frequent user, I would like to know who the developers are so that I can trust the website more.
  • As a frequent user, I would like to get different date ideas for different places.

Site Administrator

  • As a site administrator, I would like to have a distinct and recognizable logo so that it will enhance the brand's visibility.
  • As a site administrator, I would like an About Us page to foster trust with users.
  • As a site administrator, I would like to have a clear and accessible form for better user convenience.

Wireframes

To follow best practice, wireframes were developed for mobile, tablet, and desktop sizes. We have used Balsamiq to design the wireframes.

Mobile Wireframes

Click here to see the Mobile Wireframes

Hero Page

  • screenshot

Form Page

  • screenshot

Results Page

  • screenshot

Tablet Wireframes

Click here to see the Tablet Wireframes

Hero Page

  • screenshot

Form Page

  • screenshot

Results page

  • screenshot

Desktop Wireframes

Click here to see the Desktop Wireframes

Hero Page

  • screenshot

Form Page

  • screenshot

Results Page

  • screenshot

Data

We have generated possible date ideas based on user choices:

Budget Day/Night Location Date Name Date Description
1 Day City Picnic in the Park Pack a homemade lunch or some simple snacks, grab a blanket, and head to a nearby park for a picnic. Enjoy each other's company while soaking up the sunshine and the city skyline.
Countryside Nature Hike Explore the beauty of the countryside by going on a nature hike. Choose a scenic trail or walking path and spend the day discovering hidden gems such as waterfalls, meadows, or wildlife.
Beach Sandcastle Building Channel your inner child and build sandcastles together on the beach. Get creative with your designs, and see who can build the most elaborate castle or sculpture. It's a playful and entertaining way to bond and enjoy the sunshine.
Park Park Yoga Session Bring a couple of yoga mats and enjoy a relaxing yoga session in the park. This is a great way to unwind, get some exercise, and enjoy the beautiful surroundings.
Park Park Bird Watching Bring a pair of binoculars and enjoy bird watching in the park. This is a peaceful and relaxing way to spend the day and enjoy nature.
1 Night City Night Market Exploration Visit a local night market or street fair and browse stalls selling handmade crafts, artisanal goods, and delicious street food. Sample tasty snacks, enjoy live music, and soak up the vibrant atmosphere of the city's nightlife.
Countryside Drive-In Movie Night If there's a drive-in theater nearby, consider going for a nostalgic movie night under the stars. Pack some popcorn, blankets, and pillows, and enjoy a double feature from the comfort of your car.
Beach Beach Bonfire Bring along some firewood and marshmallows for a cozy bonfire on the beach. Enjoy roasting marshmallows, telling stories, and cuddling up under the starlit sky. Just be sure to check if beach bonfires are permitted in your area and follow any safety regulations.
Park Stargazing Picnic Bring along a cozy blanket, some homemade snacks, and a thermos of hot cocoa. Find a quiet spot in the park away from city lights, lay out your blanket, and enjoy the beauty of the night sky together. Spend the evening cuddling under the stars, spotting constellations, and sharing stories.
2 Day City Café Hopping and Urban Exploration Spend the day exploring different neighborhoods in the city and hopping between cozy cafes. Enjoy delicious coffee or tea at each stop and take the opportunity to people-watch, chat, and soak in the city's ambiance.
Countryside Explore a Vineyard Visit a nearby vineyard in the countryside and go on a wine tasting tour. Sample a variety of wines, learn about the winemaking process, and enjoy the scenic views of vineyards and rolling hills.
Beach Kayaking or Canoeing Rent a kayak or a canoe and explore the coastline together. Paddle along the shoreline, explore hidden coves, and admire the natural beauty of the seaside from a different perspective. Many rental places offer hourly rates, making this an affordable and adventurous date option.
Park Outdoor Games Bring along some fun outdoor games like frisbee, badminton, or a football to play together in the park. It's a great way to stay active and have some friendly competition.
2 Night City Rooftop Bar or Restaurant Visit a rooftop bar or restaurant with panoramic views of the city skyline. Enjoy a couple of drinks or appetizers while taking in the breathtaking vistas and soaking up the romantic ambiance of the twinkling city lights.
Countryside Country Inn or Bed and Breakfast Stay Book a cozy room at a charming country inn or bed and breakfast in the countryside for a romantic overnight getaway. Enjoy a peaceful night's sleep in a comfortable and quaint setting, and wake up to a delicious homemade breakfast in the morning.
Beach Evening Boat Cruise Look for a local boat tour or cruise company offering nighttime excursions along the coastline. Embark on a romantic boat ride with your partner, enjoy the sea breeze and stunning views of the shoreline, and create unforgettable memories together on the water.
Park Fire Pit Romance If the park allows it, bring along some firewood and start a small campfire in a designated fire pit area. Roast marsh
3 Day City Fine Dining Experience Reserve a table at a Michelin-starred restaurant or renowned gastronomic hotspot for an exquisite fine dining experience. Enjoy a multi-course tasting menu curated by a celebrity chef, complemented by expertly paired wines and impeccable service.
Countryside Hot Air Balloon Ride Arrange for a private hot air balloon ride over the picturesque countryside with your partner. Enjoy breathtaking views of rolling hills, lush vineyards, and charming villages from high above, accompanied by champagne and gourmet snacks.
Beach Private Beach Horseback Riding Arrange for a private horseback riding excursion along the shoreline with your partner. Ride majestic horses along sandy beaches, through rolling dunes, and along scenic coastal trails for a romantic and unforgettable experience.
Park Exclusive Horse-Drawn Carriage Ride Arrange for an exclusive horse-drawn carriage ride through the park. Snuggle up with your date as you glide through the picturesque scenery, enjoying the elegance and romance of a bygone era.
3 Night City Private Cruise on a River or Harbour Charter a private yacht or luxury boat for a romantic cruise along the city's river or harbor at night. Enjoy champagne, hors d'oeuvres, and breathtaking views of the city skyline and waterfront landmarks from the comfort of your own private vessel.
Countryside Luxury Glamping Experience Stay in a luxurious glamping tent or private safari lodge in the countryside for a glamorous camping experience under the stars. Enjoy deluxe amenities, gourmet dining, and personalized service in a secluded and serene natural setting.
Beach Moonlit Sailing Excursion Embark on a private sailing excursion under the moonlit sky with your partner. Glide across the water in a luxury sailboat, enjoying the gentle sea breeze and breathtaking views of the moon reflecting off the water
Park Fireworks Display and Champagne Toast Arrange for a private fireworks display in the park to dazzle and impress your date. Toast to your love with champagne as you watch the

=======

Testing

Our team has thoroughly evaluated the task management and project features through manual examination, testing every button and link to verify their functionality. By utilizing a range of browsers and devices during the testing phase, we ensure the application's dependability and ease of use across diverse platforms.

Unit tests

Below is a unit test designed to evaluate the models and forms within our Django application.

style.css

Code Validation

JavaScript Validation

We employed the online tool JSHint to validate the JavaScript code of Date-Knight. The code underwent validation seamlessly, without encountering any errors. This affirms that the JavaScript within Date-Knight adheres to recognized coding standards, thereby improving its reliability and performance.

HTML Validation

CSS Validation

style.css

Responsiveness

Date-Knight underwent extensive responsiveness testing using various software applications and online resources. The majority of the testing was conducted manually, utilizing Chrome Developer Tools with multiple preset device dimensions available in the toolbar.

Site Responsive Design

Lighthouse testing

index.html

about.html

Features

Existing Features

The Nav Bar

The nav bar is situated in the top of the page. It consists the logo of the web application in the top-left corner. The logo on the top helps the user to identify the page and remember it.

  • Screenshot

The Hero Image

The hero image is located right below the Nav Bar. This image of a man and woman having a date in a restaurant helps the user to identify the core purpose of the web application which is to find perfect date ideas for them.

  • Screenshot

Form

The form which slightly overlaps the hero image has the app name on top, a brief description about how to use the form and what it does beneath it to guide the user. After which there comes three categories "Budget, Place and Time" to help the user to choose their preferences. Each category comes with multiple options to choose from it, which achieves the user purpose of making the app easy to use. And with the single click of the "Find Date Ideas" button beneath, will generate date ideas based on the user's prefernces.

  • Screenshot

Results

The result generated is displayed inside a light pink rectangular box under the form with the heading "Date Ideas" to help the user know what it is about.

  • Screenshot

Footer

The footer which is at the bottom of the page consists of the app logo with the name of the app next to it. The logo is repeated again at the bottom so that it helps the user to keep it in mind and identify the app with it. The footer also has two buttons which are git hub and about us buttons which when clicked takes the user to the git hub page and about us page respectively.

  • Screenshot

About Us

The about us page has an image and a brief information beneath it about each developer who worked behind this application. Sharing the informations about the developers and being transparent helps the users to build more trust.

  • Screenshot

Future Features

  • Add more preferences for the users to choose from like indoor or outdoor, distance they can travel, Interests etc,.
  • Building more database so that the user can have multiple ideas for each preferences.
  • Displaying the results in a more attractive way in carousels and also adding image to it.
  • Creating sign up and log in page for the users to create an account in the application.
  • Saving their past preferences and it's results in the user's account for references.
  • Incorporate machine learning so that users will be able to give keywords instead of predefined choices and the AI will generate personalised ideas for them.

Tools & Technologies Used

  • HTML used for the main site content.
  • CSS used for the site design and layout.
  • Python used for the backend.
  • Django-Tailwind used as a framework for backend and front-end CSS framework for modern responsiveness.
  • Crispy Forms used for making the form.
  • JavaScript used for interactiveness.
  • JQuery used as a framework for JavaScript.
  • Jinja as a template network.
  • Git used for version control. (git add, git commit, git push)
  • GitHub used for secure online code storage.
  • Gitpod used as a cloud-based IDE for development.
  • VScode used as a IDE for development.
  • Balsamiq used to make wireframes.
  • DevTools used to debug.
  • Heroku used to host deployed site.
  • PostgreSQL used for online database.
  • Google Sheets to draw a table for generated ideas.

Credit

Media

Date Knight Contributors

Nate loves building projects in Django, React and anything Python or JS and a whole range of projects he is working on. Nate was the natural decision as a scrum master for this project and he has impressed all of us with his wide range of knowledge, and ability to problem solve and root out any problems. He has been the go-to person when any of us need help and has led the way with the backend logic for this project as well as being a quiet supporter of the heart-led design.

Dima is a full-stack developer, proficient in using Django and Flask for the backend of his applications, and employing HTML, CSS, and JS for the frontend. He has experience working collaboratively in teams and independently. Dima has been one of the core contributors to the project and quickly came up with a backend design for the project and has been quietly and diligently working on this. He has been readily available to answer questions and help the frontend team with their backend queries whenever it was needed.

Jess is a Frontend Developer passionate about creating positive user experiences by developing visually appealing and responsive user interfaces. Experienced in HTML, CSS & JavaScript, she thrives on turning innovative ideas into engaging digital experiences. Jess confidently led the front-end team on this project and created a beautiful love-themed design. Jess’ collaborative approach has made everyone feel welcome and included which helped us form a cohesive group.

Amy is a former Maths teacher transitioning to software development. She enjoys the problem-solving and creative aspects of Maths and hopes to apply this love to the field of programming and web applications. Amy is early in this transition but has been able to design and code the team’s “About Us” page as well as being on-hand to contribute to project ideas.

Mika is a nurse transitioning to software development. She has already put her all into this new direction. She loves learning new, difficult things and considers herself “a programmer embracing their cognitive masochism”. Mika combines her two passions by developing projects relating to the medical field. Mika’s enthusiasm for this project has been clear from the start and she has injected a sense of pace and movement to keep the momentum going. Mika has been on hand to design the look of the website, code the footer and write the readme.

Yagavi is a dedicated stay-at-home mom who has always harboured a deep passion for coding. She thrives in collaborative environments, making her an excellent team player. With her unwavering determination and newfound skills, she aspires to carve out a successful career in coding, showcasing the perfect blend of maternal warmth and technical prowess. Yagavi was a great team player on this project and injected her style and ideas into this project.

Acknowledgement

  • We are grateful for Code Institute Hackathon team for facilitating this event and allowing a great team to form.
  • We are grateful for our team-mates for sharing their knowledge and expertise, as well as making the time to collobarate and finish the project.

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published