Hi, I’m Brian Dys — a photographer from the inside looking out · a composer entangled in electronic music · a UX designer · a spouse, a parent, & everything in between.
Convert Content into Plain Text
The first step of re-creation is to convert content into plain text. The structure isn’t important at this round. However, as a suggestion, we could start from left to right, top to bottom. For example, the first content could be seen at the top–right:
Gmail Images Menu Icon Sign In Button
Interacting with the elements is not yet required (e.g., clicking the menu icon). Convert only those that we could see visually. Later in the next round, we’ll convert the content that would be revealed while interacting with the elements.
This activity of gathering available content of a web page is part of the process called Content Inventory.
What is RE:Creation?
RE:Creation is a design and coding activity in which we reverse engineer and recreate the HTML & CSS components of a chosen web page.
RE:Creation is short for Reverse Engineering Creation. It involves both discovery (theoretical) and delivery (technical) processes.
RE:Creation’s objective is to promote the fundamentals in designing digital products such as websites and web apps.
These fundamentals revolve around design disciplines such as Information Architecture, Interaction Design, User Interface Design, Visual Design & Accessibility, and Frontend Design.
The requirements to participate in a RE:Creation are simple: first, basic knowledge of HTML & CSS and second, a computer with these software:
- Text Editor (TextEdit, Notepad)
- Web Browser (Chrome, Firefox)
Using these software for RE:Creation does not require internet connection.
Alternatively, a web app called CodePen could be used online. It functions both as Text Editor and Web Browser for editing and displaying web documents, respectively.
Dive right in!
Did I mention that my math superpower in high school failed to work during my stint in the College of Engineering? My parents’ chosen course for me was ECE. I wrote mine in the second choice field: Creative Writing.
For a year, I managed to trudge through the hallways and classrooms of Velasco. In between schedules, I worked as an SA (student assistant) at computer laboratories—the job took me places (read: other buildings). On Saturdays, the sunny soccer field was my home as a medic in ROTC. These were the places in my world in DLSU.
Never thought of wandering past the library. Never dared to stop wearing plaid polo shirts.
During the last term of my first year, the course I was in felt like chains and balls shackled to my feet. Depression kicked in that I found myself breaking out in tears in a Philosophy class. The prof was sharing about her journey in Zen and at some point I was sure she was talking directly to me about finding freedom and peace.
Armed with an SLR and some knowledge in Adobe Photoshop, I shifted to Advertising Management (after finding closed doors in Communication Arts)—did all the paperworks and passed the qualifying exam. Then I told my parents about it. I don’t remember that it really mattered to them—the sin that I did. They were full support in my education, I realized.
One lazy afternoon, along the walkway of SJ Bldg. were recruitment booths lined up left and right. I was looking for a place where I could contribute in photography and graphic design and there I found LaSallian and Malate. Or they found me?
Just some of the works I unearthed from an old hard drive:
Other works include cover design of a couple folio issues, published photographs (of course) and some written works in a logbook—beaten and left for dead by legit poetry members.
If it stemmed from the same campaign, they all could have the same objectives.
Only at the Structure level—specifically, Information Architecture—they could be the same.
For the interface (UI), the differences are obvious—that as of this moment, physical flyers can’t handle HTML yet.
My money allowance in college—they all went to the photo shops for films and development. I started shooting black and white because they were cheaper at thirty–six shots, 200 ISO. It was sufficient back then—having thirty–six in the roll. Having a couple or more rolls would take months to expose.
Only precious moments were captured and the moments captured became captivating.
Etched in my memory until now was the dream I had of having a digital camera—yes, unlimited shutter clicks. It was a feeling—no, more like a longing—in my waking life that manifested itself one night. I woke up in frustration—of only dreaming, of not having.
Imagine the possibilities was the only thing I could think of. Imagine the possibilities of never having to curtail my favorite moments.
The results were endless offshoots—photos that were not five–star material yet not fit for the trash bin either. So they get exported into a lower resolution for easier archival.
Maybe one day, future me would match the feelings of those blurred and unkempt slices of life. Scarcity, then, would not only be about quantity but about time incapable of rewinding.