For Applied Art & Design at Sierra College
This week, I learned that responsive design is about creating websites that work well on different devices and screen sizes, such as computers, tablets, and phones. A website should not only look good but also be easy to use and understand. The content and layout should adjust to the user’s screen instead of forcing everyone to see the same design.
Continue reading “Learning Journal”These past few weeks we dove head on into more complicated concepts, which had me scratching my head more than a few times but as we power on ahead I continue to feel more confident as a web designer.
Continue reading “Weeks 5 – 6: Experimenting with Flexbox and Grids”The past two weeks have been incredibly informative. There was so much that I learned and I’m hoping it all the information absorbs into me.
Continue reading “Weeks 3 – 4: Diving Deeper into HTML & CSS”I’ve always been the type to want to know the ending before anything else; I’ve been that way for books, movies, shows—anything, really. It wasn’t until this last week that I realized I do the same thing with HTML.
Continue reading “Trusting the process with HTML”This week we got to dive into CSS animations, keyframing, and parallax! Half fun, half confusing. 🙂
Continue reading “Yay Animations!”“Meow”
This semester, I gave my portal page a much-needed upgrade. I have to say, it is been one of my favorite projects so far! I wanted the page to feel a little more alive and personal, so I brought in parallax scrolling effects, animated floating cats, and some playful, colorful backgrounds.
One of the biggest changes was adding a parallax background featuring a giant cat image that starts below the header and stretches down below my bio section. This added a really cool , making the page feel more dynamic without being overwhelming. I also used CSS animations to create floating kitties that drift across the screen, adding even more movement and personality.
Along with parallax, I used some modern CSS techniques like flexible layouts, colorful background shifts with keyframe animations, and subtle box shadows to give different sections some extra pop. Overall, this revamp made my portal page feel way more “me.” It’s fun, creative, and just the right amount of chaos thanks to all those giant kitties.
Why is my image outside the container? Why does my text look like that? Why is that section up there and that other section way down there? These are all questions that popped up in my head several times with this week’s lessons!
Continue reading “Ah Responsive Design”The past two weeks we’ve been working on two website assignments. Sacramento Writers Group and Zen Music Festival.
Continue reading “Even more Responsive Design!”This week, it occurred to me that I’m doing responsive design all wrong.
Continue reading “Things Are Getting Responsive”This week, I was really challenged by the Sacramento writer’s group and zen music festival challenges.
Continue reading “My Goals and What I Learned This Week”Just when you think you are finished with a website design….
The past two weeks have been a deep dive into the world of web design. What started as simple class projects quickly turned into opportunities for real discovery. I did not just follow instructions. I started noticing how different choices in layout, structure, and tools can completely change how a website feels and functions.
Continue reading “Two Weeks in Design: Learning by Doing”Hello Everyone!
This week we learned a ton about responsive design, worked with it hands on, and dove into its history. We also finished up our midterm! I’ll talk about how mine went.
Continue reading “Responsive Design + Midterm!”It can be crazy to think about now, but computers used to be the only device we used to access the web. There was hardly a need to consider screen size when creating a website. Now we have smart fridges with internet access.
Continue reading “Adapting with CSS”This week has been a doozy.
Continue reading “Midterms, Midterms…and More Midterms”
This week, I worked on designing a fictional website for the movie The Shawshank Redemption using Figma. The goal of this project was to apply visual design principles while also thinking about user experience (UX) and navigation flow. I wanted the design to capture the emotional tone of the film, including its themes of hope, resilience, and friendship, while maintaining a clean, modern layout suitable for a movie-focused website. You can view my interactive prototype here: Figma Prototype
The structure of the website includes a landing page with a hero section, a short synopsis of the film, a cast section with actor images and names, and a simple navigation bar. I focused on maintaining visual hierarchy by using large headings, consistent spacing, and high-contrast colors to guide the user’s attention. The typography was chosen to reflect a sense of depth and seriousness, similar to the mood of the movie.
Figma was incredibly helpful throughout the process. I used frames and auto layout to keep spacing consistent across different sections, which made the design feel more organized and scalable. I also created components for elements like buttons and movie cards, which helped me make quick updates and keep everything consistent.
The prototyping tools in Figma allowed me to simulate the user’s experience on the site. I added interactions like hover effects and page transitions to test how users might move through the design. While testing, I noticed a few UX issues, such as unclear navigation and misaligned buttons. I revised these elements to improve usability and flow.
This project gave me the chance to apply both visual and interactive design skills. It also helped me become more confident in using Figma not just for static design work, but also for building working prototypes. I’m proud of the final result and excited to keep learning and designing more advanced user experiences in future projects.
P.S. If you’re into design and use Figma regularly (or want to start), don’t miss config 2025, Figma’s annual design conference. It will take place on May 6-8, 2025, both in-person in San Francisco and online for free.
It’s a great opportunity to learn from industry leaders, discover new features, and get inspired by real design stories from around the world. I highly recommend joining, even just attending online can spark so many new ideas!
This week, I had the opportunity to learn about responsive web design and continue to better my midterm design.
Continue reading “My Goals and What I Learned This Week”Designing for the web can be …
Now that we are halfway through the semester, I can see my CSS and HTML knowledge improving. All of the practices, notes, and challenges have helped me practice strategies and learn new techniques. When working on the Midterm Drafts and learning responsive design, I can see my growth from my previous class. To me learning responsive design for me was a major step towards making more professional sites.
Continue reading “Week 8: Midterm and Responsive Design”These last two weeks have been a challenge! I had never even heard of grid, positioning, or floats, until this course. This is all very new and a bit overwhelming, but I am determined to understand it to the best of my abilities.
Continue reading “Week 5 & 6 Layout Techniques”
