Updated
To continue my journey with figma, I made a reusable asset and tried to scale for different screens. I made a "home" button for my screens since I didn't have one as well as created a new home screen to go with it that served as a better introduction for what I wanted to do.
I then tried out different constraints and sizes of frames. I made sure all home screen buttons were constrained to the center and to the bottom of the frame. I then practiced on resizing different frames. This part was a little harder. I tried the scale constraints but that didn't do what I wanted it to. I thought it would change the size of the text, but it didn't. What kind of worked for me was creating a whole new frame and having it centered and then constraining the text inside that and manually making it smaller. I will try to play around with it more to figure it out though. Another feature I discovered auto layout which I don't entirely understand, but you can add padding to different elements. That's just another thing I'm interested in playing around with.
(first: text is constrained to the box/frame, second: scaled down, third, fourth, fifth: different sized frames w/ text manually made smaller in the first one and it stays consistent for the fourth and fifth).
*I will try to add more before class on Monday
Introduction
For an intro web development course I had, we did a hypertext narrative to get us introduced to html and css. I did a similar thing for this assignment. I used Lorde lyrics and images from her tour to put together something that you can click through and it will take you to a different visual for one of her lyrics or songs. It was mostly to test out making animations and getting a feel for figma. The nice thing is that it will be easy to continue to add to it just to practice.
I've used Invision before which is similar. I did like the canvas of this one more, but I feel like it would definitely be easy to become disorganized. However, I feel like animating buttons on that one is easier. (Also, I used hover for an iPad which I get wouldn't be super helpful if this was an actual interface, I just got caught up in the fact that things were changing in the preview haha.)
Some things I found a little confusing was making the prototype interactions. I wasn't able to get the to work if I was applying them to a line and I wanted to be able to do a swipe function but wasn't sure how to do that. I also don't really understand the difference between mouse in/touch down and mouse out/touch out. The touch functions worked better to accomplish what I wanted, but I also don't entirely understand what they're doing that's different than the mouse ones.
Comments