Screenshots:

Reflection:

I learned about Auto Layout, Overlays, Components and Variants by doing this project. I learned Components and Variants in previous projects but this project helps me understand them better. Now, I feel more comfortable with them. I could easily do the basics without no problems. I did not know much about Overlays. I do not think I have used them in my previous projects. But in this project, I used them a lot. I think the overlay feature of Figma is really cool and useful feature. Lastly, the Auto Layout. Out of everything, I struggle with this one the most. It is the hardest one for me. I had a hard time understanding this one.

I am unhappy with my board design especially the grid. I wanted to add some padding inside the grid so that the chips doesn’t touch them the outline of the grids. And there are some features that I wanted to add but I could not as I did not know to. For examples, I wanted to add a timer or a countdown for the players so that they won’t be able to take forever to play a turn. Another one is that switching the player’s turn and chip color. My workaround for that one was to use “keys”. I used tab and space to change the color of the chips and the players. I think I could have done better in that regards. Overall, I am happy with what I made. I think it met my goals of making the ui as simple as possible while not losing the game’s functionality.

Mobile Screenshots:

Reflection:

I have done some web projects: some are personal and some are projects from my computer science courses. So, I am a little familiar with html and css, and some javascripts. Because of this, I did not really have any troubles with doing this project. However, I did have some problems with CSS. I think I spent most of the time on adjusting the css for making the website responsive. I adjust the stylesheets live using the Web Dev Tools from the browsers and when I am satisfied I made the changes directly in my source code.

Initially, I used Figma to design the prototype of my website. I recommend doing this because it saved me a lot time. I did not have to waste any time on design when I code no more. I am already very familiar with Figma so it helps a lot. I love web development, so, overall I had fun doing this project.

Website Link: http://brahe.canisius.edu/~thangs/dma370/project2/

Reflection:

There are some new things and old things that I learn/re-learn by
doing this project.

Let’s start with the old things I learn. I forgot about how components and variants works. But I re-learn how they works and how to implement them. I did most of the work from things that I learn from my previous classes. However, there are new things like master frame, and also tried to implement the “flat-ism” design and “long-shadow” in this project. Before, I did not know about Master Frame. But it seems like it good be potentially very useful when working on large projects so I am glad that I learned that.

Overall, it was not diffcult for me personally as I am a little famaliar with Figma as I have used it in my previous courses. However, I feel like I have lots to learn to make the workflow very efficient. Sometimes, I find myself doing tedious tasks that I could have “automated” like using a master frame to make changes to all the frames for instance.

I chose Myanmar for this project. It was where I grew up and spent most of my early years. The country, culture, and the people are amazing and wonderful – cannot say the same about the people in power or the government. Anyway, Myanmar is a beautiful and very diverse country in general.

I chose Bo Aung San, Bagan, Lahpet, and Agriculture for well-known person, place, cuisine, and industry of the country respectively. I chose Bo Aung San for well-known person of the country because he is widely regarded as the father of the country who fought and help the country, Myanmar, gain independence. Almost everyone from the country know who he is. This is why I chose him. Next, I picked Bagan for place/attraction. This one was a bit difficult because there are so many beautiful places that exists in Myanmar such as Inle Lake, Shewdagon Pagoda, Ngapali and so many more. The main reason I pick Bagan out of so many available options is that the place represents the country cultures and values. For cuisine, I selected Lahpet. The reason behind it is that Lahpet is consume by everyone, both people who are rich and poor. Almost everyone have it at their household. Lastly, I picked agriculture as the industry of the country. Majority of the country economy is of agricultural products. Those are a summary of the reasons for my selections for this project.

As for the project, one thing I found really difficult was coming up with a really creative design for the stamps. It was really difficult which is why my designs are very simple. Apart from that, I did not really have any major trouble with anything. I was able to apply techniques and knowledge from previous labs and projects such as choosing color schemes instead of choosing randomly from project 2, image manipulation techniques from project 3, and typography from project 4.

“Row, Row, Row Your Boat”

Reflection

My chosen nursery rhyme for this “Row, Row, Row Your Boat”. I chose this one in particular because it sounds very peaceful and brings hopefulness whenever I hear it. I think it is a beautiful nursery rhyme.

I did not really not know anything about typography before this project except that it has something to do with writings and letters. I did not know typography was about choosing style, fonts or forms and arranging the letters to makes words more clearer, readable or visually looking good. I have seen several of examples in ads, book covers and stickers. I thought that they were cool but I also thought that they would not be hard to do until I do this project. I found it very challenging to arrange words and letters in my frame. Sometimes, I have so many words to fill in and have little to no space but other times so few words that much of the space of the frames are empty so I have to make adjustments like font-size, weight, spacing and so on. I think this was the most difficult part of this project. I also did some sketches but I could not emulate them in Figma. I could not curve the letters the way I want them to look like for instance. However, there might be some ways to do it like using pen tool or something. I wanted to use other fonts to experiment but I could only use the Barlow fonts. It would be really great to have other font options to play around with. The speaker from Figma, Miggi I think, was great. I learn some I think it was really helpful like how to make the “shortcuts panel” show up by pressing ” Ctrl + Shift + ? “. I did not know it existed and it is really helpful when I use Figma because sometimes I forgot new shortcuts that I learn.

“It is okay to not be okay” – No one is always gonna be happy or sad. There will times a person is sad or happy. It is okay and normal to be not be okay. After all, this is life. Nothing is perfect.

Words can make a person’s day or ruin their day. Words are very powerful. Sometimes, mere words can hurt a person more than if they were hurt physically. This is why it is important to think before saying something…

Reflection:

From doing this project, I learn about what “flattening” does, plugins in Figma, creating patterns in Figma and what “masking” means and does. I also learn about various image combining methods such as addition, substitution, patterns and collage.

I find that manipulating/editing the images are a bit harder in Figma. I think Photoshop is better in that regard. However, the plugins from Figma made a lot easier to do things like quickly finding images and inserting directly to my project, removing the background with just a click and finding icons in vector format.

The image combining methods I learn from this project will help me with future’s course assignments that will require manipulating images or just for personal use or personal projects.

Reflection:

From this project, I learnt about tertiary, complementary, split-complementary, analogous colors. I also learnt little about color gradient. And how these things could be used to set mode. I also learnt what hue, saturation and lightness means.

I think these are kind of cool and did not expect I could make these things just by using simple shapes like circle, square, star and so on.

Reflection:

I learned about what is a Gestalt Principle, and various Gestalt Principles. Also on why Gestalt Principle is useful in Web and Mobile Designs.

Readings that I have done during this project:

1. https://www.avocademy.com/blog/what-are-the-10-gestalt-principles#:~:text=We%20will%20be%20discussing%2010,%2C%20proximity%2C%20and%20common%20fate.
2. https://www.usertesting.com/resources/topics/gestalt-principles
3. https://www.avocademy.com/blog/what-are-the-10-gestalt-principles#:~:text=We%20will%20be%20discussing%2010,%2C%20proximity%2C%20and%20common%20fate.