Colors

Primary

#1976d2

Primary Variant

#f9f9f9

Secondary

#000000

Gradients

Warning

#e53935

Success

#20c788

Typography

Heading

Custom Font: Mighty Souly Font - https://www.fontspace.com/mighty-souly-font-f111821

This is some text inside of a div block.

Notes:
‍
Added my own made Logo in Photoshop.
Changed certain Pages to Gradient Colours.
Added custom linked text: Boilerplate Page in Footer.
Changed All images to fit the Florist Vibe.
Changed Every text to florist themed.
Florist Services and Gifts.
Made my own gift card and donation Images.
Search Function unable to work due to pay-wall.
Made wireframe in Figma.
Added and made Custom button that goes to shop.
Custom Font: Mighty Souly Font - https://www.fontspace.com/mighty-souly-font-f111821
Why I choose WebFlow:
1. Recommended by fellow peers
2. I like the functionality and freedom of making a website
3. Many themes and many choices for web building
‍
Options Considered:
‍
‍Wix: Easy drag-and-drop builder but limited design flexibility for advanced animations.

‍WordPress: Highly customizable with plugins but requires more coding and setup time.
Feedback:
‍
Aj: The website looks sick, you really cooked with that.
‍
Iain: I like the website, I would probably add custom gift cards.

(Added custom made in photoshop Gift Cards and Donation Cards - As seen on the left.)

Links to Images:
https://pixabay.com/photos/autumn-aster-purple-yellow-flower-7504819/
https://pixabay.com/photos/flowers-table-vase-bouquet-window-7233987/
https://pixabay.com/photos/beach-wedding-reception-1854076/
https://pixabay.com/illustrations/flower-flower-decoration-border-8582484/
https://pixabay.com/illustrations/cabinet-furniture-home-plant-room-7277181/
https://unsplash.com/photos/white-and-green-leaf-plant-KcufLkTXYy4
https://pixabay.com/photos/wedding-reception-table-banquet-1854074/
https://pixabay.com/photos/table-setting-table-preparing-set-791149/
https://pixabay.com/photos/flower-bouquet-rose-roses-pink-3215149/
https://pixabay.com/photos/desk-office-office-desk-computer-4962107/
https://pixabay.com/photos/hand-gift-bouquet-love-1549399/
https://pixabay.com/photos/flowers-rings-bouquet-260894/
https://pixabay.com/photos/daffodils-tea-tea-time-cup-of-tea-1316127/
https://pixabay.com/photos/azalea-white-pot-sunglasses-791914/
https://pixabay.com/photos/iphone-iphone-6-iphone-6-plus-apple-791450/
https://pixabay.com/photos/marigold-flower-dewdrops-1568646/
https://pixabay.com/photos/flower-garden-still-life-gardening-779317/
https://pixabay.com/photos/rose-flower-valentines-day-hand-5951728/
https://pixabay.com/photos/mothers-day-valentines-day-roses-3699995/
https://pixabay.com/photos/rose-petals-flower-bloom-nature-1215314/
https://pixabay.com/photos/couple-hugging-outdoors-grass-2601156/
https://pixabay.com/photos/happy-man-adult-city-face-guy-1836445/
Documentation
‍
Steps Taken:Planning:
‍Researched competitors and identified Flora’s unique services.
Defined target audience and key pages like Home, Services, and Contact.

‍Design:
‍Created wireframes to map layouts and high-fidelity prototypes to finalize design.
Focused on a clean, modern look with simple navigation.

‍Development:
‍Built the website in Webflow, ensuring responsiveness across devices.
Added animations and interactive elements for a polished feel.

‍Content Creation:
‍Wrote engaging copy to highlight Flora’s services.
Integrated high-quality images of floral arrangements and testimonials.

‍Testing:
‍Tested the site for functionality and mobile responsiveness.
Fixed bugs and refined my fellow peers experience based on feedback.

‍Challenges & Solutions:
‍Ensuring the site looked great on all devices: Solved by thorough testing and adjustments.
Balancing text with visuals: Focused on concise copy and impactful images.

‍Outcome:
A fresh, vibrant website that beautifully represents Flora’s brand and services!