mariellenmdd-blog

[mariellenmdd-blog]

Artist’s Statement

My work is inspired by the things I love and love to look at — my friends and beautiful things. I love the romanticism and beauty of cinema, how the atmosphere is always perfect, the music is always right, and the pick-up lines are always funny. So I put elements of my real life — my models and actors are always my friends — and put them to music, whether that be literally in film, edit images of them into something that has the movement and dynamics of music, or overlay their words on top of music.

[mariellenmdd-blog]

And They Were Roommates — The Podcast 

[mariellenmdd-blog]

study date playlist

The inspiration for my project are movie soundtracks. I love how movie soundtracks are perfectly curated to make you feel certain emotions and put you in the place of the character. I did very minimal video editing besides jump cuts to differentiate the “real life” scenes versus the “movie” scenes to show how just adding music can change the entire shot. 

Note: Received permission for found sound in advance from YouTube Audio Library during 1-on-1 meetings.

[mariellenmdd-blog]

head underwater

My piece is a visual representation of how having a panic attack feels.  I often describe panic attacks as feeling like I want to escape from my own body. I used imagery of water and the physicality of keeping your head above water and tearing off clothes to others who do not experience panic attacks to convey to how it feels like drowning. I used dark, cold colors juxtaposed with a warmer-toned, beautiful distorted body to highlight how this terribleness is contained in a human body.

[mariellenmdd-blog]

Final Project

For my final project, I made an interactive infographic on p5 for an Observer article. The article is about the USG Election Voting Results. I made an interactive pie chart with the voting results. 

USG Elections Infographic

Thanks for a great semester! 

[mariellenmdd-blog]

Week 11 HW p5 part 2

dynamic pattern: icicles

inspiration: I really got the hang of using triangles in p5 from last week’s hw so I wanted to continue using them. I wanted it to seem like you were forming snowflake/icicles patterns & I was inspired by the Northern Lights for colors.

[mariellenmdd-blog]

Week 10 Javascript HW

static composition: mountains in the distance 

drawing tool: square-to-circle pen

my biggest struggle working with p5 was visualizing the grid & all the math, so here are my notes while I was working on the hw: 

[mariellenmdd-blog]

Midterm Website

Project

Individual Pages as Pens

home fashion philanthropy about

[mariellenmdd-blog]

Images For Midterm Website

[mariellenmdd-blog]

Midterm HW

Wireframes/Annotations

Home Page (1)

Home Page under the fold (2) 

Fashion Page

Philanthropy Page

About

Stylesheet

https://codepen.io/pen/?editors=0100

[mariellenmdd-blog]

WEBSITE INSPIRATIONS

I chose the blogs of Zoella, Meghan Rienks, and Anna from Paris With Me because their content is mainly fashion and lifestyle & is very image-focused. I chose these three influencers because I really love their instagram aesthetics & their style (which I love) translates on their website. 

Zoella

Meghan Rienks

paris with me 

[mariellenmdd-blog]

Week 4 HW

Notes & Questions:

Everything is aligned & centered correctly on my laptop, but when I open up codepen on a desktop, all the space for the h2 headings is off.

[mariellenmdd-blog]

pictures for website

[mariellenmdd-blog]

HTML Project Process (and mistakes)

Final Website

THE PROCESS

•I wanted to create a website that reflects my Photoshop project, as if it was the “About” page for my fictional book. I used the same fonts & color palette in my website as the book.

•Aligning pictures were my nemesis. For the bookstagram pictures, I wanted them to be aligned side-by-side, after trying so many different things (mostly from w3schools) I got them aligned side-by-side. I meant to switch the pictures, but I ended up accidentally making them vertically aligned again & switching the text to the other side of the website & I actually really liked how that looked. 

•For the work-in-progress pictures at the bottom, I couldn’t figure out how to move the pictures back to the left side & I was too scared about messing up the top pictures since I did it by accident.

Here are screenshots of when I messed up my HTML big time & just had to CMD+Z until it went back to normal:

From when I tried to side-by-side align the pictures: 

From when I tried to switch the pictures: 

STRUGGLES

I like how CodePen separates the HTML & CSS because it’s easier to read, but most online tutorials have them combined, so I was easily confused when trying to follow them.

QUESTIONS

WHAT IS “FLOAT”? WHY DO I NEED TO FLOAT AN IMAGE? FLOAT???

THE VERDICT

I respect everyone who can understand coding & who has the patience for it, but HTML & I are not friends. 

[mariellenmdd-blog]

Photoshop Project Progression

Here are the focal points of my photoshop project! I couldn’t decide between the two photos at first, but ended up going with the ladder picture because it fit more with the aesthetic of my book cover & I really wanted to include the ladder. I tried using the magic wand and lasso tools, but the bookshelf backgrounds were too busy for those tools to properly cut out the figures I wanted. So the eraser tool ended up being my best friend. 

[mariellenmdd-blog]

I chose to make the would-be cover if I ever wrote a book. That book would be called “Edit,” and it was definitely be YA contemporary romance novel. I really love reading and the online book reviewing/publishing community. 

I drew inspiration from my favorite book covers and tried to figure out why I found those covers so aesthetically pleasing: pastel colors, bold text, bold graphics & I ended up using those covers to make a sidebar. I got the picture from my bookstagram account @mariellebooks. 

Design Principles •Balance - At first, I wanted the ladder to be leaning on sidebar, but the misalignment was too much so I split them up. However, it ended up looking too boring so I faded the sidebar so picture would stand out more.

•Hierarchy/proximity - I played around with the layers and which text/graphics would overlap which to create depth on the book cover. 

•Contrast - Since I was using so many pastel colors, I outlined the text & picture in a dark color & upped the opacity of the picture so they would stand out. 

Working with photoshop is really frustrating & at first, I was convinced Photoshop couldn’t do anything more for me that Microsoft Paint could, but once, I started playing around with the eraser and the selection tool & I played around with the order of layers, I really enjoyed it.

Total time spent on project: 5h 25min

Edit by Marielle Sarmiento

The debut novel from author Marielle Sarmiento is “The Mindy Project” of YA contemporary literature.

“Literally better than anything I could have ever written.”   –William Shakespeare “It’s just fanfiction about her own life. It’s like she copy/pasted from her finsta.”   —my roommate

[This is my Photoshop project for NMDD! Disclaimer: This book does not exist…yet.]

[mariellenmdd-blog]

Edit by Marielle Sarmiento

The debut novel from author Marielle Sarmiento is “The Mindy Project” of YA contemporary literature.

“Literally better than anything I could have ever written.”   –William Shakespeare “It’s just fanfiction about her own life. It’s like she copy/pasted from her finsta.”   —my roommate

[This is my Photoshop project for NMDD! Disclaimer: This book does not exist...yet.]