Carlos Porto Portfolio

Page 1

UX/UI designer

Industrial Designer

CGI/3D art

Designer

About me Highly motivated and proactive professional with profound fundamental understanding in 3D artistry and UI/UX design with over 10 years of experience as a 3D artist, specializing in architectural visualization and industrial design. Proven track record of collaborating with cross-functional teams to develop and implement design solutions that meet the needs of stakeholders and end-users.

Skills UX/UI design Storytelling Through Desig Digital art/Imager Illustratio Graphic desig 3D modelin Renderin 3D and 2D Animatio Prototyping

Portfolio page 1

page 2

page 3

page 4

3D modeling/CGI During my exploration of UX/UI design, I developed a jiu-jitsu app that not only reflects my dedication to the craft but also serves as a testament to my passion for design.

In the realm of music, I delved into designing an app, showcasing my passion for both music and design.

While at Adobe, as part of the Acrobat team, I've contributed to various projects. Here, you'll find a brief summary of two particularly important ones

A selection of my 3D modeling projects, encompassing industrial design and my deep-seated passion for character design.


CASE 1 Project: Viper Dojo Project type: personal/individual

Background We are proposing a digital tool designed to significantly enhance the learning and progression of Brazilian Jiu Jitsu (BJJ) beginners. Our product aims to serve as a valuable complementary resource to their journey as new practitioners.

What is Brazilian Jiu-Jitsu (BJJ) Brazilian Jiu Jitsu (BJJ) is a ground-based martial art emphasizing leverage and precision. It's accessible to people of all ages and abilities, with a growing global presence. BJJ's inclusivity enables anyone to enjoy its benefits, including self-defense, mental well-being, and fitness.

Overarching questions

What is essential for the Brazilian Jiu-Jitsu learning process?

Would a new digital tool be relevant for the students' needs?

How can we help students to skyrocket their BJJ skills?

P

roject process timeline

mpathize

Define

Ideate

Qualitative researc

Key finding

Competitive analysi

Project scop Persona

Opportunity tre Brainstormin User journey

E

Research synthesis

P

rototype

ketchin Wirefram High-fidelity

S

Competitive analysis Popular BJJ apps

BJJ flow charts

Marune

Combat Academy

BJJ Buddy

This is a free app that offers videos featuring various techniques. It contains a large number of BJJ technique videos, but the content is poorly organized, and the user interface (UI) is severely lacking. While navigation is straightforward, it definitely lacks proper user experience (UX) design.

This “social media like” platform offers compelling features such as training progress tracking and more. However, the product's user-friendliness leaves much to be desired; the app as a whole is quite confusing, and the user interface lacks visual appeal.

This platform stands out due to its unique content categorization system. However, it's worth noting that despite its potential, it can be quite confusing and contains numerous unnecessary distractions throughout the user experience.

This app primarily emphasizes training and performance tracking while also providing a social media platform for martial artists to share their content. The app has notable drawbacks: it is resourceintensive, prone to bugs, and features a user interface that is visually unappealing.

https://apps.apple.com/us/app/ bjjflowcharts/id1619508682

https://apps.apple.com/us/app/marune/ id1405069801

https://apps.apple.com/us/app/combatacademy/

https://apps.apple.com/us/app/bjjbuddybjj-tracker-journal/id1063025257

Research synthesis Key findings

Memorization

Communication

Existing Resources

Classes rely on 100% expository teaching, requiring students to memorize techniques. To address challenges, students often record videos and take notes for future reference.

Feedback and communication are crucial in students' progress, and the current graduation system serves as motivation for their continued advancement.

Students frequently use YouTube videos but face functionality issues. They prefer concise videos, especially those showcasing familiar techniques.

P

Content Design ne common issue is the lack of clear organization of content in schools, making it challenging for students to navigate and find relevant information efficiently. O

ersonas

William Sarmiento Age: 38 Occupation: Business owner Education: Bachelor’s degree Status: Married BJJ level: White belt (beginner)

P

ersonality

Tech

Extrovert

Introvert

Internet

ensing

Intuition

S

Thinking

Feeling

Judging

Perceiving

S

oals

Bio

G

eet William Moor, a 38-year-old architect and business owner. William loves martial arts and outdoor adventures, and Brazilian Jiu-Jitsu holds great importance to William as it offers not only physical fitness and mental discipline. He and aims to find time balance between his professional life, family and his physical activities. M

P

ocial Media

Gadgets Early adopter

ain points

emorizing BJJ techniques Saving BJJ class content is hard Minimal room for clearing doubts Lack of communication with the team

Improve his BJJ skills Optimize time and learn effectively Boost martial arts progress while prioritizing job and family.

M

I often forget what the professor teaches, so I record it for later review when I have time."

I've just started Jiu-Jitsu, and I really enjoy it. I wish I had more time to practice. It’s a very nice game!"

"

"

Wireframes Login screen

Create profile

Home screen

Program screen

Class screen

Team screen

Profile

Dashboard

Your profile

Feedback

HIgh fidelity prototype

S

ee prototype

The hi-fi prototype includes the basic functions of our product, providing a general idea of how the initial version of Viper Dojo will operate. Please check the prototype by clicking the link bellow:

Figma prototype Link


CASE 2

Project: Notematrix Project type: personal/individual

Background NoteMatrix Collaboration App, a user-centric platform for musicians and songwriters. We aim to develop a platform that caters to the fundamental collaboration needs of independent music professionals. In our research process, we strive to comprehend the key challenges and determine how we can differentiate ourselves as a tool to enhance and streamline collaboration among independent musicians, regardless of geographical constraints.

Overarching questions Challenges

Features

Differentiation

What are the primary challenges independent musicians encounter during the production of their art?

What essential features should a collaborative music platform offer to enhance the collaborative music creation process?

Can a new collaborative music platform set itself apart from existing solutions.

Project process timeline Empathize

Define

Ideate

Prototype

Qualitative researc Competitive analysi Research synthesis

Key finding

Opportunity tre Brainstormin User journey

Sketchin Wirefram High-fidelity

Project scop Persona

Competitive analysis

SoundBetter

Soundtrap

BandLab

SoundBetter is the top music production marketplace for global musicians to hire professionals. However, it lacks inproduct collaboration tools, and the $99 monthly membership may be financially challenging for some users.

Soundtrap is a pioneering web-based music studio for collaborative recording and production. While its recording features shine, its user interface may not match the modern aesthetics of some rivals.

BandLab is a social music platform where creators can make music, share their work with musicians and fans. It provides a recording and collaboration studio for both free and paid users. However, there is room for improvement in terms of user experience as the platform's interactions could be made more intuitive.

https://soundbetter.com

https://soundtrap.com

https://www.bandlab.com

Research synthesis Key findings Networking

Communication

Brainstorming

Networking through the collaborative music platform plays a crucial. Participants highlighted that engaging in collaborative projects facilitated meaningful interactions with other musicians.

Musicians emphasized the need for real-time chat, video conferencing, and instant messaging features to enhance collaboration efficiency.

Participants highlighted the need for a userfriendly interface to upload, share, and cocreate music sketches, streamlining the initial phases of the creative process.

Virtual Jam

Copyright

Learning

Concerns about intellectual property and

The idea of virtual jam sessions emerged as a valuable feature. Participants expressed interest in the platform facilitating real-time, low-latency jamming opportunities.

Collaborative music projects offer valuable learning opportunities, indicating that fostering

copyright protection were crucial findings. Musicians emphasized the need for robust security measures to safeguard their original work while collaborating with others.

learning through collaboration is a positive and beneficial aspect for musicians on the platform.

Identifying priorities The chart represents the proportion of key findings from the interview data, focusing on insight cluttering. It helps identify patterns and concentrations, ensuring a balanced approach to

address cluttering in the collaborative music platform design.

Persona

Mila Belucci Goals Collaborate with music professionalscollaborate with fellow musicians and songwriters to co-create music projects. Grow and refine her songwriting

skills. She sees collaboration as an avenue for expanding her musical horizons.

Age: 32 Profession: Songwriter Status: Single Education: Bachelor of Music

Personality

Bio

Meet Mila, our songwriter persona. Mila is a dedicated music

professional who possesses a deep passion for her craft. She is on the lookout for potential collaborators in the online realm to join forces in creating and ultimately selling music projects.

Pain points Limited financial resources make it difficult for her to invest in professional services, equipment, or promotional efforts. Identifying and connecting with collaborators who share her artistic vision and can contribute effectively to her music projects.

Tech

Extrovert

Introvert

Internet

Sensing

Intuition

Social Media

Thinking

Feeling

Gadgets

Judging

Perceiving

Early adopter

Mila’s Journey

Connect Connect and network with fellow artists to explore collaboration opportunities.

Showcase Showcase demos and project proposals, allowing for sharing and feedback.

Engage Attract individuals with similar interests, building a vibrant network.

Brainstorm Utilize an online recording feature to initiate collaborative brainstorming.

Make it real Produce and promote high quality music as a result of efficient collaboration within the community

Ideation Networking

Communication

Brainstorming

Legal

Learning

How might we optimize networking opportunities

How might we enhance

How might we optimize

How might we ensure a

How might we optimize

Social media feature.

Create features to provide seamless communication such as live chat and comments.

Collab area (whiteboard) as a virtual environment where users can share their ideas and upload/ record music.

Create documents from templates tailored to different legal cases and requirements.

Virtual classroom for skill

through the platform to facilitate meaningful connections?

ability to add and manage a network of music professionals

communication between musicians in a collaborative music platform to facilitate realtime interaction?

the brainstorming process within the collaborative music platform to encourage creative exploration?

robust and reliable system for copyright protection within the collaborative music platform?

Wireframes Home/projects

Collab/whiteboard

+ Open in studio

Studio/recording

Network/social

High fidelity prototype

See prototype The hi-fi prototype includes the basic functions of

our product, providing a general idea of how the initial version of NoteMatrix will operate. Please check the prototype by clicking the link bellow: Figma prototype Link

collaborative music projects to maximize learning opportunities for musicians?

improvement where users and experienced musicians share knowledge.


Sign in Acrobat & Adobe sign

A brief glimpse of a couple of projects I've been heavily involved in at Adobe.

Acrobat onboarding

The project The "Onboarding" project is intended to help new users of Acrobat understand and discover the product's capabilities and value. The goal is to ensure that new users can smoothly navigate their way to success without any interruptions, while also encouraging them to explore features that can offer significant advantages.

Fast and easy Show me just enough to get something done quickly.

My Contributions: ollaborated with the design team during the ideation phase to explore userfriendly interface concepts for new users.

New UI: C

ontributed to the design of a polished project presentation, with a focus on conveying concepts and frameworks to stakeholders, particularly emphasizing the visual aspect. Presentation: C

Stay on target Don’t waste my time with information I don’t need right now.

Onboarding

Be a catalyst Find new ways to get things done, so I can grow my business.

omepage wireframe

H

The Homescreen serves as the gateway to the onboarding project. This is where users will form their initial impression of the experience, making it essential to offer guidance while preserving a sense of freedom and delight. We leveraged in-depth research data to build a project that aligns with our users' behavior and needs. acrobat.adobe.com

ome

dit

Documents

H

onvert

E

E-

C

ll tools

sign

A

L

earn

Bring folks together

ollaboration tools to get virtual teams on the same page C

ry it now

T

iew all tools

V

load a file

Up

onvert a file

Starred fles

ecent files

R

Shared files

Fill & sign

Organize pages

C

greements

A

dd comments

Do business better with Acrobat

A

OPENED

NAME

SIZE

Try PDF editor

Sample document

Sep 26

PDF

Close the deal with e-signature

760 KB

Connect your cloud storage accounts

Sign sample document

Sep 26

PDF

760 KB

Set up your brand

dit sample doc

E

Sep 26

DOC X

Collect payment with e-signatures

760 KB

Get the desktop app

dit sample doc

E

Sep 26

DOC X

760 KB

ry the scan app

Secure your files

E-signatures vs ink signatures

Get the Acrobat mobile app

Fill forms

T

Simple PDF editing

Sign a snap

Get your team in here

Share yo

ome-screen onboarding components

H

ero Carousel

1

H

This element uses motion to draw the focus to most important content with a visual treatment and additional text. The purpose is to emphasize Acrobat capabilities and create excitement around what is possible with Acrobat and the value a finished result will create, along with a way to get started.

Quick actions

2

Quick actions provide immediate access to frequently

used functions across the Acrobat platform. They ensure that both new and experienced users can effortlessly find and use these essential features.

Checklist

3

It is a clear, self paced path goal based users to gain -

-

competence with Acrobat.Here users have the option to follow a step-by-step list of actions designed to help them fully grasp and master the product's key features, enabling them to achieve their goals.

4

ero Carousel

H

Uses motion to draw the focus to most important

content with a visual treatment and additional text.

Designed to emphasi e Acrobat capabilities and create z

excitement around what is possible with Acrobat and the value a finished result will create, along with a way to get started.

ome-screen mockup

H

Vie er w

w

ireframe

In the viewer, users will retain access to onboarding guidance and content, conveniently located in the closable

left panel. Here, they will find a checklist, similar to the one displayed on the homescreen. Additionally, a help panel will be available on the right side of the screen. This setup allows users to select from essential features designed for their specific goals, general features in the "things to do" section, which may be of interest, even if not immediately crucial, and straightforward, to-the-point help in the right panel.

acrobat.adobe.com

dit

onvert

E

Sign

C

Discover

our files

Y

ompany_Contract .pdf PDF

C

omments 1

Discover

C

Things to try

For you

Discover

A

Things to try

For you

L

orem ipsum dolor sit amet, consectetur adipiscing elit. Quisque ac ligula eget mauris tincidunt tristique. Sed condimentum diam ac tellus cursus, nec fringilla ante fermentum. Nulla facilisi. Vivamus nec mi in metus congue hendrerit. Sed rhoncus ultrices metus, a mattis odio ultrices sit amet. Nunc id ultrices ipsum. Sed tristique, nunc nec ultrices cursus, tortor libero mattis turpis, vel venenatis sapien elit id sapien. Integer cursus lectus ut est tincidunt, id luctus urna laoreet. Sed auctor, nunc non consectetur tristique, purus arcu facilisis ex , ut interdum ligula dui sed ex . Sed iaculis.

ddress a comment

collaboration

Someone tagged you

A

dd text or image

orem ipsum dolor sit amet, edit consectetur adipiscing elit. Quisque ac ligula eget mauris tinciduntDesign a new page tristique. adobe express L

Share your file

collaboration

Save to the cloud organize orem ipsum dolor sit amet. L

Page 1

L

Working with your first document

A

orem Ipsum

dd comment

orem ipsum dolor sit amet.

ennyfer woo

J

ust now

J

i amus nec mi in metus congue hendrerit. Sed rhoncus ultrices metus, a mattis odio ultrices sit amet. V v

L

L

orem Ipsum

orem ipsum dolor sit amet, consectetur adipiscing elit. Quisque ac ligula eget mauris tincidunt tristique. Sed condimentum diam ac tellus cursus, nec fringilla ante fermentum. Nulla facilisi. Vivamus nec mi in metus congue hendrerit. Sed rhoncus ultrices metus, a mattis odio ultrices sit amet. Nunc id ultrices ipsum. Sed tristique, nunc nec ultrices cursus, tortor libero mattis turpis, vel venenatis sapien elit id sapien. Integer cursus lectus ut est tincidunt, id luctus urna laoreet. Sed auctor, nunc non consectetur tristique. L

orem ipsum dolor sit amet. L

orem ipsum dolor sit amet. L

6 30

More step by step guidance

Vie er onboarding co ponents w

1

m

For you

2

Personali ed content and wor flow z

k

recommendations are based on factors like entitlement type, history, or questions that indicate intent.

2

2

1

Things to try

Explore and discover broader value within

document cloud, and use cases that increase MAU

3

elp Panel

H

Stepped, guided tutorials in Acrobat-provided sample documents

Vie er w

m

ockup

Adobe ign S

“S

end in bulk

The project

My Contributions:

The "send in bulk" feature enables users to send a document for signing to a large number of recipients, potentially in the thousands. Recipient details can be manually entered when the list is not extensive, but for larger companies, the option to upload a CSV file is available to streamline this process.

Redesign: I have been actively involved with the team in the ideation and redesign of the UI for this particular feature. This was a complex process, as it required a significant amount of automation and addressed engineering challenges, which involved lengthy negotiations to ensure its successful implementation. I have contributed to multiple explorations and presentations for the new UI, drawing insights from data provided by the research team.

The challenge The old interface is both unfriendly to users and aesthetically outdated. It does not adhere to the Adobe design system (Spectrum). Furthermore, certain features and configurations within it have demonstrated low usage in recent research, while other essential actions are not easily discoverable or, in some cases, non-existent. OLD USER INTERFA E C

The UI, in general, is outdated and lacks consistency with the modern Adobe design system.

t this level, some features are not critical, while some important ones remain hidden or not visible. A

Upload CSV file is not clear/discoverable

agreements and recipients’ information are not properly organized/categorized L ack of hierarchy.

Redesigning e've introduced a comprehensive redesign, meticulously crafted to harmonize with the Adobe design system and thoughtfully incorporating the wealth of new data at our disposal. This fresh solution has been meticulously engineered to address and fulfill the specific needs and requirements identified by our dedicated research team. W

A

ome

H

dobe Acrobat Sign Send

Workflows

Manage

Reports

ohn Appleseed

J

Send in Bulk Send the same document to many recipients. Type in their email addresses or upload a CSV file with agreement specific data.

A

greement details Name

Send from

Default Group (Primary) A

L

ease agreements

dd file

Message templates

Message L

Please complete and sign your lease agreement. Thank you!

ease Template pdf

Pet addendum.doc

Drag and drop your file hoose more files

C

A

greement settings

ompletion Deadline May 17, 2023

C

A

emind Frequency None

R

Password

None

Language

nglish/US

E

dd recipients

Bulk recipient list Ev

Replace with CSV file

ery bulk recipient will receive their own copy of the agreement nter or paste comma separated emails to quickly add bulk recipients

E

9 agreements

mail

E

mail

Name

mail

Name

E

E

CC

Preview & Add Fields

Send Now

Important Agreement configurations are now discoverable

Position the option to upload a CSV file in a more suitable location. Simplifying the process of entering recipients when it's done manually. Clear division of agreements and recipients configurations ’

Vie er w

m

ockup

Thank you!

Feel free to get in touch if you'd li e to learn more about my experience with Adobe. k


3D modeling/CGI

Here are some samples of my 3D/CGI work. For more details and high-resolution images, please visit my ArtStation profile at

http://gutocsd.artstation.com

Character design I'm genuinely passionate about digital sculpture and character design, as they offer me a creative playground where I can bring my ideas to life and craft distinctive characters.

Industrial design My experience in 3D design and modeling for the furniture industry spans a wide spectrum, showcasing my proficiency in bringing practical and aesthetic solutions to life.

Architectural visualization My early years as a 3D artist were primarily focused on architectural visualization. While I may not consider myself an expert in this specific field, it was the initial spark that ignited my enduring passion for visual design and 3D modeling.


Turn static files into dynamic content formats.

Create a flipbook
Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.