lazygirl

Next Step: Coding

Designed Library Section to an extent.
Since I have designed enough to understand the design language of my app msyelf and get an overall idea about how & where things should be, I’m halting the design process for now to save time as I must ship before 31st march… not much time left to code.
At the very least, I’ll code the back end logic for card creation, review & dashboard elements and ship a partial but in a way, complete & good project.

I’ll come back at times when needed.

Multiple things this time.

• Made refinements to the dark mode styles.
  Designed:
• card drop down
• card review (front)
• card review (back)
• create card (front)
• create card (back)
• create deck
• create shelf
• scratchpad
• tested these designs’ modified version for mobile layout
• added flow to try, test & get feedback from friends

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.

IMP NOTE for Reviewers: The next devlogs will only be major ones to avoid devlog clutter.

In this Devlog:

I designed Dark Mode by learning more about variables, setting up new values & making a few manual modifications
Don’t mind the cut-off search bar in the attachment. I’ll fix those things when I’m coding and make it responsive.

Mini Milestone: Completed Dashboard for Mobile

These are for light mode only, dark mode is yet to design.
Also, the designs are not responsive. I don’t find the need, for now at least.
I’ll most likely add responsiveness when I code.

Milestone: Dashboard Design Complete

• Improved streaks
• Improve mini-analytics
• Added “today at a glance”
  – The round progress display took me over an hour to figure out (I tried a couple of things – all complex to design at my level)
• Added Scratchpad
• Changed the overall Dashboard layout

Major Leap on the Dashboard

• Updated Views (Today, Week, Month, All Time -> 7 Days, 30 Days, All Time)
• Updated color for selection on views
• Revamped mini-analytics so that it feels like the dashboard
• Completed streaks panel
• Changed Search Text
• Added red & green color variables
• Minor changes in alignments in some places

Completed Mini-Analytics on the Dashboard & Started Building the next: Streak

Minor Update

• Updated font variable & re-aligned what was needed.
• Centered Search with the dashboard screen. Shifted views accordingly
• Further refined action buttons

This devlog contains ~2hrs of time which should have been added in the last devlog; it couldn’t due to a lapse error I was facing.

Anyways, so in the rest ~2h18m, in ~60% of the time, I added the two action buttons which are one of the most important and will be consistent across multiple sections of the app. I completely redesigned the buttons twice and tampered a lot with it to make it look good. It’s still not up to the mark imo tbh but it’ll do for now. I spent the rest of the time enhancing some icon effects for the sidebar & updating variables.

Updated top navbar & completed sidebar (Missing 2hr to be added in next devlog due to lapse error)

• Added & updated color, font & size variables
• Refined layout
• Added feedback for buttons & current selections
• Added shadows & blurs for better aesthetics
• Updated colors across typography, subtle but powerful (imo)
• Separated branding area
• Have created three variants of icons for theme selection (system, dark, light)
• Planned sidebar content in detail
• Have created two variants for every menu option except theme, one variant to display while it is selected (active) and another while it’s not selected (inactive)

Feedback is welcome.

Attachments: Some Planning + Paper Wireframe + Hi-Fi Figma Prototype (so far)
Don’t mind my handwriting :melting_emoji:

After abandoning the last design structure and pivoting to a new one, I have made some progress with this.

This time, before beginning, I did some paper prototyping (wireframing).
So far, I have:

• Completed wireframing
• Started in figma
• Completed the top nav bar (common for all app sections)
• Completed the view options (common for analytics & most likely dashboard)

Next Step: Making the sidebar

The last dashboard style (as in attachment) wasn’t exactly what I was looking for.
Designing this gave me a lot of design insights and helped me learn more in Figma.
….
I’m pivoting towards a slightly different concept, inspired by insights from the last one & feedback from friends & cousins. – which you will see in the NEXT DEVLOG.

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’ve been progressing with the designing – wireframing + some colours for less strain on my imagination.
I’m currently wireframing the dashboard (homepage) of the app. – So far so good.
..
It’s been slow because I’m still learning Figma. There’s a landslide of a difference between my first & this (3rd) project but it’s still not fast or efficient or where I want it to be.
..
Anyways, I’ve added some attachments for anyone who wants to check it out.
Feedback/Critic is always welcome & appreciated!

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

Since voting resumed, my first published project has received repeated feedback for more frequent & more detailed devlogs so I’ll be following that now.

I have now:

• created wireframes (with some detailing & images as well) for onboarding pages – though it’ll need refining at later stages
• have been simultaneously creating one for desktop size (macbook air) and one for phone (iPhone 17)
• created some images using gemini for an onboarding page – have mentioned in the main AI Usage part of the project as well.

Honestly, I myself feel this work is kinda sloppy.. idk… let’s see.
Feedback is always welcome, of course.

NOTE: The attachments are widely zoomed out to not reveal too much and also, save myself from embarrassment :melting-emoji:

I have:

• created more exportable & usable logo, icon sizes with transparent & non-transparent options.
• created typography variables.
• written down a release plan (thus, the development plan).
• created the promotional website sitemap.
• created the app userflow map (for first release).
• written down some architectural points (based on my limited knowledge).

I did all of this in Figma, while also learning it.

I have now moved to wireframing and have created designs for registration page, login page & account recovery page for both desktop and mobile.

The feedback I received from people around me was not as good as I was expecting.
Made some tweaks to the design.

Feedback is welcome!!!

I have completed making the logos, icons in different export sizes (16x16, 32x32, 64x64, 256x256, 1024x1024 – for now).

This is the third app I’m working on and I can see that my design is improving.
This time I took care of the minute details too; I have learnt that the little tweaks matter more than I thought.

I’m open to suggestions, critics & applaud!

I am finally starting work on the first project I created on flavortown.
I have created the favicon and created exportable for different dimensions.

Next Steps are creating the complete logo and adjusting for a dark icon.

Completed Version 1.0 !!!!!
(Only for macOS Tahoe)

I have added these features in this initial version:

• Basic Dark Mode.
• Dark Icons & Widgets.
• Separate Wallpaper for Light & Dark Modes.
• Single click toggle based on your settings.
• Start at Login option.

I created it entirely using Swift using XCode with some help of AI.
All the AI Usage, Detailed Installation & Usage Guide are available in the README File.
Please check it out and give your suggestions!!

Designed the UI: MenuBar & Window

Created icons & color swatches for this app.

Completed V1.0

UI is ready now.
All actions planned for Version 1.0 are ready.
All left to do is figuring out why the helper installation error is being so stubborn 😭

Updated the icons

Created icons for the app

I have added lockdown functionality that disables TouchID, restore option & built basic UI.

I have completed the empathize & define phases of UX.

I conducted roleplay user interviews using AI.
Pinpointed several user pain points.
Created User Personas & User Stories.
Documented Problem Statements.
Created Hypotheses.
Created Product Goal Statements.

I have been developing on this app to offer some peace of mind to privacy-concerned users.
This app will help mac users disable their touchID and sleep the mac to be extra secure during flights, busy households, school, dorm, etc.

I plan to build apps for other platforms too. Let’s see where it goes!

P.S. I really wanted to add an attachment and I had no visuals for the app so I thought this should do 🫠