markmcsweeny95

Final devlog-

Updates since last devlog

• Added a link from my landing page through to my portfolio
• Added a live scrollable view of my portfolio
  -Moved header components across slightly

I started off by adding the link from my landing page through to my proffessional looking portfolio which i built with wix and has many more of my social links and about on it. I did this by adding it as a text link which redirected to the home page of my wix website. I then also added a live view of my portfolio website as well which works well for people who do not want to clcik on the link however it makes it a lot more noticable and also fills up some of the space on the landing page. Finally, i moved the portfolio text link from the left next to the instagram logo over to the right by itself so that it doesn’t look like my instagram is the portfolio and that the portfolio is a seperate link.

This project was very fun to work on and it taught me some fun skills on how to do html. Thanks to w3 schools for all the helpful guides on how to code html too.

Devlog 3-
Since the last devlog i have made a few imrpovements including:

• Adding instagram link
• Shortening urls to make code more visually pleasing
• Moved header closer to logo by adjusting margin
• Changed header and subtitle sizes to match logo size
• Changed instagram link size to match logo and header size

I started off by adding in my instagram link and then i added an image icon of the instagram logo i found so that the user can click on the logo and be taken straight to my instagram page. When i copied the instagram url and the icon url i noticed they were very long so i used tinyurl to generate me some shorter urls which means my code editor does not need a horizontal scrolbar. I also removed the margin between the heading and subtitle and the logo so that it is coser together and feelsmore proffessional and less like it is spreading out everywhere making the look appear neater and more proffessional. I also made the Heading and sub heading sizes slightly smaller so that they match with the size of the logo and so that the subheading is clearly a subheading. As well as this i made sure that the instagram logo was a simiair size to the logo but still slightly smaller so it doesn’t take attention away from the logo.

Devlog 2-

Since the last devlog i have made several updates including;

• Customising text sizes
  -Adding a logo
  -Experimenting with padding
  -Aligned logo in line with header and subtitle
  -Removing nests which caused code not to work

To customise the text sizees i simply used font-size: 50px; and font-size: 20px; to make it easy for the user to easily distinguish between the title and subtitle. To add the logo i took the image adress of my portfolio website and added the url in. I created a padding around the edges of 150 pixels to allow for text to be more centred but not waste loads of space on the edges, i however later removed this because it was getting in the way of aligning my image. I spent most of the time working on trying to get my logo in line with the title and subtitle at the top of the page as well as moving the text to the side so that the logo can sit in the corner. I removed some nests as well which were making the code hard to function.

Skills learnt from w3 schools website

My very first devlog for this project…

In this devlog i worked on creating a title called MM Designs and i also added a heading of MM Designs and a subtitle of “This is my personal site”, i created the subheading as a paragraph and the heading using … i also used some very basic css to customise the look by making the background black and the text white to fit in more with the coding/ dark mode aesthetic. I also had to work out how to centre my text so tat it looks proffessional however i may change this later.

I am using w3 schools website as a guide to creating this

Added a simple feature which requires users to confirm they have selected the correct timings before they begin which means they won’t start a timer they don’t want to use. I also made it so that the timer is paused by defualt at the start until spacebar is pressed.

Created a set of instructions to guide the user through how to use the code and what to do if they encounter errors, the instructions are the second thing to appear so very visible to the user.

Added functionality which will allow the user to enter their continent and city and it will work out their current time zone and also means that they can have an accurate time displayed on their screen, might make it show the finish time in future.

Finished the project!!!!!

Finished by working on final text animations and setting time delay back to realtime as well as adding my @ and contact details (slack and github repo) to my in code readme for people who have not yet read the readme, there’s always some…

Finished code of project,might still make a few small improvements to the UI though, any reccomendations welcome :)

Timing and pausing logic fixed as well as working on makign cycles update in 0.1s of a cycle

Started fixing some final bugs but taking a while bebcause one bug is causing another. Almooooost finished surely.

Added a function so that the code will wait 0.1s before printing each line of code making it feel much more alive and connected to you. I also added a readme which users are told to read before using the software which will be the same readme as on github, firther progress to the readme is required as well as spacing and formatting of words.

Reverted code back to an older version as well as Working on the output of the project (how the text interface looks to the user. Almost inished now!!!

Attempeted to fix bugs but then created even more bugs in the process, ahhhh python.

Added pause functionality to allow the user to pause and unpause the timer at any time using the space bar, further updates to come on this

Finished cycles code, wooohooooo! Now when cycles remainign = 0.4 for example it will only do a fraction of the normal time, meaning that the time actually stops when the user expects it to.

Made the cycles signigfier work properly so it actually reduces properly each cycle. (Still have oossible improvements to make to it.)

Added the cycles option which means the enitre thing tuns a specific number of repeats, very complicated making a loop and had a few issues with defining things as variables etc, still have a few bugs but it is getting there now.

Added a cycle visualiser which allows the user to see how many cycles of the pomodoro timer they have left (doesn’t update for now)

Fixed the approximate decimal hours left by adding 1 on so that it never shows 0.0 hours also worked on adding study time summary circle to original timer as well as the custom timer.

Worked on adding a suummary ring in the top left corner which shows the ratio of studytime to break time in a nice visual. Had a few bugs and had to work on positioning it in the right place

Fixed some subtle bugs including one where i forgot to clear the screen after the hrs is printed which means it overlaps, also i started working on creating a code which can show the live time on the clock as well and when the timer will finish in real time. I made it so that it displays the current time right now (Uk) to get used to the live time modules

Worked on some simple debugging as well as adding 2 new turtles which will be used to display information on the timer screen. First tirtle has been loaded up to show total hours left and the second turtle will be programmed to show the real time time when the timer will finish ie. (10:25)

Screenshot of first turtle displaying time accurately

6 mins - fixed minor bug which only occurred when user selected a custom timer and a study or break period over 60 mins where it would display more than 60 mins for example “1hours, 96mins, 34secs”. Also improved time display so that it removed mins secs and hours and replaced them for colons. Also made it so that if time is less than 10 it displays as 09 for example to avoid flicking screen.

Worked on the Timers visuals and improved them by making the colours more appealing and calming, I also made the text bold to make it easier to read and feel like it has a softer edge. Also removed the flashing effect from the time display by only updating the screen when I need to.

Re-organised code entirely and heavily added comments to make code easier to process for next steps and make it more maintainable.
(I KNOW YOUR NOT SUPPOSED TO UPLOAD SCREENSHOTS OF CODE AS EVIDENCE, BUT I HAD NO OTHER EVIDENCE SORRY)

Added the timer visuals to the custom timer set up which allows user to set any time as a study time and a brak time as long as it is not a decimal. Also, began to clean up the code by adding comments and defining variables more cleanly. (DEMO RUNNING SPED UP TO DEMONSTRATE)

Added status info in the top corner to allow the user to know whether it is a study period or a break period. Created using a new turtle specifically for that task. Also ran into a problem when previous screen would clear so had to fix that!

Made UI of timer slightly better and converted seconds into hours minutes and seconds as well as removing the turtle arrow. definitely still not done yet though!

Edited my turtle timer interface to allow for custom timings for the study time (black) and the break time( green). Only shows time left in seconds for now. Also, only currently works for one cycle of study/break

Created a very rough visual for a framework for how the final timer will look and programmed it to draw perfect circles over a set period of time, tested it at 60s and when it goes other it turns red and shows that the countdown has finished

Created extra variables which allowed me to extract a large amount of data from just the decimal time and the total cycle time. It allowed me to even work out how many cycles and the exact minute remainder

Created an algorithm to convert the time inputted by the user into a number of pomodoro cyles whether that is 30 mins total (25 min study and 5 min break) or if it is a custom one.

Added human error detection which prevents user from entering text values of time and simplified some code by adding loops.

Put my decimal time to hours and minutes time into a subrotine which allows me to call it at any point. And returned a value which includes strings as well as variables.

Worked on building the fundemental framework for the project as well as writing up my algorithm for converting decimal time into mins and hours as well as some basic human proofing. Very rough design at the moment with a lot of room for human error.

Created some final fillets to put onto my project and added my initials onto my design to protect my work from being stolenn without my consent.

Created the main components - Almost finished now just need to add some carefully placed fillets and chamfers to make a proffesional looking product and need to create animations of final product.

I designed the model in onshape, printed it out on my printer, then cut glue and assembled it to create a 3d model of the design.

Worked on UI by customizing wait times to make website feel intuitive and removing large volumes of text as well as fine tuning other components

Added first text based mode for determining the value of the resistor using the colour code

Today i worked on the resistor visualizer allowing user to enter resistor value and pythons turtle module will draw it out with correct colour bands (assuming gold for tolerance)