*--.--'``'-...__...-'``'--.--**--.--'``'-...__...-'``'--.--**--.--'``'-...__...-'``'--.--**--.--'``'-...__...-'``'--.--**--.--'``'-...__...-'``'--.--**--.--'``'-...__...-'``'--.--**--.--'``'-...__...-'``'--.--**--.--'``'-...__...-'``'--.--**--.--'``'-...__...-'``'--.--**--.--'``'-...__...-'``'--.--**--.--'``'-...__...-'``'--.--**--.--'``'-...__...-'``'--.--**--.--'``'-...__...-'``'--.--**--.--'``'-...__...-'``'--.--**--.--'``'-...__...-'``'--.--**--.--'``'-...__...-'``'--.--**--.--'``'-...__...-'``'--.--**--.--'``'-...__...-'``'--.--**--.--'``'-...__...-'``'--.--**--.--'``'-...__...-'``'--.--*

(&)

(%)

($)

-/\

Interface! Let’s go! zine

A zine about all the quirks of web interface.

---~--^---~----~--=--~~--+----~----~--^---~----~--=--~~--+----~----~--^---~----~--=--~~--+----~----~--^---~----~--=--~~--+----~----~--^---~----~--=--~~--+----~----~--^---~----~--=--~~--+----~----~--^---~----~--=--~~--+----~----~--^---~----~--=--~~--+----~----~--^---~----~--=--~~--+----~----~--^---~----~--=--~~--+----~----~--^---~----~--=--~~--+----~----~--^---~----~--=--~~--+----~----~--^---~----~--=--~~--+----~----~--^---~----~--=--~~--+----~----~--^---~----~--=--~~--+----~----~--^---~----~--=--~~--+----~----~--^---~----~--=--~~--+----~----~--^---~----~--=--~~--+----~----~--^---~----~--=--~~--+----~----~--^---~----~--=--~~--+----~-

(&)

-/\

[!]

Role

Project Direction,

Design,

Writing,

Visual Communication,

Print matter,

Website.

Date

Theme

Context

The zine is about collected ideas of website interfaces that appropriate or react against something, inverse or amplify website tropes. Through the content, I hopes to connect with readers that share similar interests and may even get something out of it!

You can read the zine online here or the embedded pdf below.

($)

[*]

For each page of the zine, I added page numbers on the right side within a rectangle, giving it the appearance of a web interface scrollbar. To make this process more efficient, I created a JSX script in InDesign. This script automatically added the page numbers and adjusted the scrollbar length based on both the page number and the total number of pages. It saved me a ton of time!

[=]

-/\

Here are some Insta-friendly assets I whipped up. They feature the zine getting a lot of love from different weird and quirky human hands. I used AI magic with DALL·E2 to create these.

(&)

($)

(#)

Honestly, there wasn't some deep concept behind it. I just thought that when referring to product mockups, there is a tendency to add human body parts like hands, feet, or a head interacting with the product. Is it to make those inanimate products more lively instead of sitting still against the plain white wall? I just embraced this concept and oversaturated it with lots of body parts, which in this case, hands.

-/\

(%)

($)

[+]

[!]

Below are some of the images of my zine in non-Ai, human environment!

-/\

[=]

This image was taken during my Taipei trip in Nov 2022

[+]

-/\

($)

(#)

Thank you Tran!

-/\

[=]

[!]

-/\

Thank you anh Minh!

Bảo Anh as graphic designer

Joanne Pang for consultation

This zine is published under Prypress

Individual Credits

Bao Anh

Joanne Pang

Group Credits

Prypress, SG

The navigation bar that is in the middle of nowhere

Personal website 2022

Other works

*-- ** .--. aa ._. uu .--. ** --**-- ** .--. aa ._. uu .--. ** --**-- ** .--. aa ._. uu .--. ** --**-- ** .--. aa ._. uu .--. ** --**-- ** .--. aa ._. uu .--. ** --**-- ** .--. aa ._. uu .--. ** --**-- ** .--. aa ._. uu .--. ** --**-- ** .--. aa ._. uu .--. ** --**-- ** .--. aa ._. uu .--. ** --**-- ** .--. aa ._. uu .--. ** --**-- ** .--. aa ._. uu .--. ** --**-- ** .--. aa ._. uu .--. ** --**-- ** .--. aa ._. uu .--. ** --**-- ** .--. aa ._. uu .--. ** --**-- ** .--. aa ._. uu .--. ** --**-- ** .--. aa ._. uu .--. ** --**-- ** .--. aa ._. uu .--. ** --**-- ** .--. aa ._. uu .--. ** --**-- ** .--. aa ._. uu .--. ** --**-- ** .--. aa ._. uu .--. ** --*

(&)

-/\

[!]

An artist website focusing on claiming the traces left behind during a web development process, pondering the question of how we can observe the growth of a web page.

Victoria Hertel Velasco website

2023-11

[!]

(#)

My final year project, delving into the longlasting division between North and South Vietnam, intricately woven with my family's personal stories.

Nam Bắc Một Nhà

2023-01

-/\

($)

[*]

A font that when moved up, it becomes uppercase; moved down, it's lowercase.

Variable-Case modular font

2023-02

[=]

($)

[*]

Visualization of human passion inside web developer tools.

Measure a machine’s heart

2023-05

(&)

(%)

[!]

Transform Google Translate into a platform battling against censorship!

Google Translate: Uncut

2023-01

[+]

-/\

($)

-/\

A website with its navbar in the middle?

The navigation bar that is in the middle of nowhere

2022-08

--^~-----^~--Wait a bit-^~~--_---^~---^~-----^~--Wait a bit-^~~--_---^~---^~-----^~--Wait a bit-^~~--_---^~---^~-----^~--Wait a bit-^~~--_---^~---^~-----^~--Wait a bit-^~~--_---^~---^~-----^~--Wait a bit-^~~--_---^~---^~-----^~--Wait a bit-^~~--_---^~---^~-----^~--Wait a bit-^~~--_---^~---^~-----^~--Wait a bit-^~~--_---^~---^~-----^~--Wait a bit-^~~--_---^~---^~-----^~--Wait a bit-^~~--_---^~---^~-----^~--Wait a bit-^~~--_---^~---^~-----^~--Wait a bit-^~~--_---^~---^~-----^~--Wait a bit-^~~--_---^~---^~-----^~--Wait a bit-^~~--_---^~---^~-----^~--Wait a bit-^~~--_---^~---^~-----^~--Wait a bit-^~~--_---^~---^~-----^~--Wait a bit-^~~--_---^~---^~-----^~--Wait a bit-^~~--_---^~---^~-----^~--Wait a bit-^~~--_---^~-

(%)

($)

Waiting...

**********************************************************************************************************************************

--^~-----^~--_-~----^~~--_---^~---^~-----^~--_-~----^~~--_---^~---^~-----^~--_-~----^~~--_---^~---^~-----^~--_-~----^~~--_---^~---^~-----^~--_-~----^~~--_---^~---^~-----^~--_-~----^~~--_---^~---^~-----^~--_-~----^~~--_---^~---^~-----^~--_-~----^~~--_---^~---^~-----^~--_-~----^~~--_---^~---^~-----^~--_-~----^~~--_---^~---^~-----^~--_-~----^~~--_---^~---^~-----^~--_-~----^~~--_---^~---^~-----^~--_-~----^~~--_---^~---^~-----^~--_-~----^~~--_---^~---^~-----^~--_-~----^~~--_---^~---^~-----^~--_-~----^~~--_---^~---^~-----^~--_-~----^~~--_---^~---^~-----^~--_-~----^~~--_---^~---^~-----^~--_-~----^~~--_---^~---^~-----^~--_-~----^~~--_---^~-

-/\

Site is built on Next.js with Tailwind CSS. CMS is from Notion API with react-notion-render ↗︎ by @9gustin for data rendering and upload-notion-images-to-cloudinary ↗︎ by @guillermodlpa for hosting images form Notion to Cloudinary. You can view the database on Notion here notion link ↗︎. Other dependencies include Prisma + PostgreSQL, Framer Motion, probe-image-size, seedrandom, react-lazy-load, ... See the Github repository of the site here github link ↗︎.

Typeface is Alegreya ↗︎ designed by Juan Pablo del Peral, Huerta Tipográfica. Mono typeface is Select Mono ↗︎ designed by MICHAEL McMASTER.

The idea of the site can be observed via the 3D View of the developer tool of Microsoft Edge. Inspect the site to see.

(&)

(%)

($)

-/\

Interface! Let’s go! zine

A zine about all the quirks of web interface.

(&)

-/\

[!]

Role

Project Direction,

Design,

Writing,

Visual Communication,

Print matter,

Website.

Date

Theme

Context

You can read the zine online here or the embedded pdf below.

($)

[*]

[=]

-/\

Here are some Insta-friendly assets I whipped up. They feature the zine getting a lot of love from different weird and quirky human hands. I used AI magic with DALL·E2 to create these.

(&)

($)

(#)

-/\

(%)

($)

[+]

[!]

Below are some of the images of my zine in non-Ai, human environment!

-/\

[=]

This image was taken during my Taipei trip in Nov 2022

[+]

-/\

($)

(#)

Thank you Tran!

-/\

[=]

[!]

-/\

Thank you anh Minh!

Bảo Anh as graphic designer

Joanne Pang for consultation

This zine is published under Prypress

Individual Credits

Bao Anh

Joanne Pang

Group Credits

Prypress, SG

The navigation bar that is in the middle of nowhere

Personal website 2022

Other works

(&)

-/\

[!]

An artist website focusing on claiming the traces left behind during a web development process, pondering the question of how we can observe the growth of a web page.

Victoria Hertel Velasco website

2023-11

[!]

(#)

My final year project, delving into the longlasting division between North and South Vietnam, intricately woven with my family's personal stories.

Nam Bắc Một Nhà

2023-01

-/\

($)

[*]

A font that when moved up, it becomes uppercase; moved down, it's lowercase.

Variable-Case modular font

2023-02

[=]

($)

[*]

Visualization of human passion inside web developer tools.

Measure a machine’s heart

2023-05

(&)

(%)

[!]

Transform Google Translate into a platform battling against censorship!

Google Translate: Uncut

2023-01

[+]

-/\

($)

-/\

A website with its navbar in the middle?

The navigation bar that is in the middle of nowhere

2022-08

08/2019 →05/2023 (expected)	LASALLE COLLEGE OF THE ARTS Singapore Diploma in Design for Communication and Experiences For the AY 2021 - 2022, I take a gap year to return to my hometown, Vietnam. I will be coming back to Singapore this August 2022 to resume my study.
09/2016 →05/2019	HIGHSCHOOL FOR THE GIFTED—VNUHCM Vietnam High School Diploma

08/2022 →10/2022	PRACTICE THEORY Graphic Design Intern – Communication & Visual Designer for the Singapore-based creative studio
07/2021 →12/2021	THE LAB SAIGON Junior Graphic Designer – Communication & Visual Designer for the Saigon-based creative agency
05/2019	INTEL PRODUCTS VIETNAM Independent Freelance Illustrator – Stage Background Illustrator for the company’s year-end event.
2017 →Now	SMALL MEDIUM ENTERPRISES Freelancer in Graphic Design – Responsible for the visual images, graphics, illustrations and concepts for clients’ needs.

07/2022	D&AD New Blood Academy – Participant.
01/2022 →03/2022	Google Developer Solution Challenge 2022 – Participant.
09/2021 →04/2022	Google Developer Student Club - UIT – Development team.
05/2021 →10/2021	Project Vietnamme—a non-profit organisation dedicated to the relationship of young Vietnamese and the Arts. – Graphic Design Consultation.
10/2020 →01/2021	Vietnamme Magazine—magazine.vietnamme.me, an online magazine dedicated to the contemporary arts in Vietnam. – Website Development, Graphic Design.
10/2017 →01/2018	Human Library Vietnam—a non-profit organisation dedicated to raising awareness to societal issues. – Graphic Design, Illustration.
08/2017 →08/2018	Project Sugar—a non-profit student-run organisation dedicated to underprivileged children – Graphic Design, Illustration, Art Direction.

2022	D&AD NEW BLOOD YELLOW PENCIL – Awarded 2022 Yellow Pencil by D&AD New Blood for the entry Duolingo: Non-fungible Efforts.
2021	RED DOT JUNIOR AWARD – Awarded “Red Dot Junior Award” under Red Dot Award: Brands & Communication Design by Red Dot Award in 2021.
2021	CERTIFICATE OF TYPOGRAPHIC EXCELLENCE TDC67 – Awarded “Certificate of Typographic Excellence” in TDC67 by Type Directors Club and will be included in the Annual of the Type Directors Club, The World’s Best Typography.
2020	LASALLE SCHOLARSHIP 2020-2021 – Awarded LASALLE Scholarship 2020–2021 to cover my tuition fee for my great performance at LASALLE College of the Arts.
2019	LASALLE TUITION GRANT – Awarded 60% merit-based tuition grant for my tuition fee in the diploma at LASALLE College of the Arts.

Individual Credits

Group Credits

Previous

Next

Other works

Victoria Hertel Velasco website

Nam Bắc Một Nhà

Variable-Case modular font

Measure a machine’s heart

Google Translate: Uncut

The navigation bar that is in the middle of nowhere

LASALLE COLLEGE OF THE ARTS

HIGHSCHOOL FOR THE GIFTED—VNUHCM

PRACTICE THEORY

THE LAB SAIGON

INTEL PRODUCTS VIETNAM

SMALL MEDIUM ENTERPRISES

– Proficient with the following Digital Softwares:

– Familiar with the following Digital Softwares:

– Technical Skills:

D&AD New Blood Academy

Google Developer Solution Challenge 2022

Google Developer Student Club - UIT

Project Vietnamme—a non-profit organisation dedicated to the relationship of young Vietnamese and the Arts.

Vietnamme Magazine—magazine.vietnamme.me, an online magazine dedicated to the contemporary arts in Vietnam.

Human Library Vietnam—a non-profit organisation dedicated to raising awareness to societal issues.

Project Sugar—a non-profit student-run organisation dedicated to underprivileged children

D&AD NEW BLOOD YELLOW PENCIL

RED DOT JUNIOR AWARD

CERTIFICATE OF TYPOGRAPHIC EXCELLENCE TDC67

LASALLE SCHOLARSHIP 2020-2021

LASALLE TUITION GRANT

Individual Credits

Group Credits

Previous

Next

Other works

Victoria Hertel Velasco website

Nam Bắc Một Nhà

Variable-Case modular font

Measure a machine’s heart

Google Translate: Uncut

The navigation bar that is in the middle of nowhere