FortressMode Website

A long overdue update ig
I mainly work on my (potentially) hero project for this ysws which is “Kognit Flashcards”.
This is… like a side project when I don’t feel like working on Kognit.
The intention is to actually publish this website to promote my app “FortressMode”, especially overtime when I add more features to it.
In these 2 hours, I have refined the existing content, planned, tested & decided on the next part of this landing page and started implementation.

So far so good.
I have now set the designs (as of last devlog) as layouts which will be reused for actual designs.
…
I have completed 50% work for the homepage and attached a video.
Feedback is welcome.

I have now:

• Improved the nav bar design, modified icon & button sizes
• Added background image with reduced transparency & additional fill
• Added progressive layer blur to the bottom of the background image for smooth transitioning
• Replicated for mobile
  – Created menu bar icon (3-bars)
  – Created its expanded version’s design
• Made the design responsive for both desktop & mobile

Again, the main intent with this is to practice & enhance my skills with Figma, which did happen significantly in this session; though it cost me some good time.

In this session, I have:

• Designed NavBar
• Improved Branding
• & Completed Header for Desktop

Next Steps:

• Improve responsiveness
• Replicate for Mobile
• & More, ofc.
  The main intent with this is to practice & enhance my skills with Figma.
  The more I design first, the more I realise I would never come up with designs as good (or less bad idk) as this.

I am now designing the website in Figma,
simultaneously for Dark & Light modes,
simultaneously for Desktop & Mobile.

While it’s not a mobile app & no one might visit this site on mobile to begin with, I still want to do it to make mistakes & gain experience which I’ll be able to use in projects where this responsiveness matters a lot.

So far I have:

• Set up variables (in Figma) for:
  – Colours for Dark/Light Modes.
  – Font sizes for Desktop/Mobile.
• Set up frames for Dark & Light Mode, for Desktop & Mobile

I’m creating a website to promote an already published project “FortressMode”.
I’ll be updating more frequently with devlogs based on the feedback provided by peers in previous project.

For now, I have updated icons & created more exportable transparent sizes using my more developed figma skills by:

• creating transparent subtractions
• adjusted scaled variants