rogerweikers

Overview Aimores Telesys Sindilub Petrol Magik JC RW Gallery Studio Contact

Overview of UX design projects:

Rogério Weikersheimer - Welcome to my UX Design and Information Architecture portfolio.

In this independent session, I bring examples of cases developed for some of my clients: Aimorés, Telesys, Sindilub, Petrol, Magik JC and a personal project for my own art gallery.

I graduated from the Google UX Design course and, along with my background in branding management, I was able to understand that we cannot "please" only the end user or the client who hired us to create the product. The details of this piece are sensitive and subtle, also involving the demands and trends of the market, as well as cultural values and customs.

For the operational part, I use tools like: Microsoft Office, Adobe (XD, Illustrator and Photoshop), and Figma. For development management, I use Scrum concepts to generate the backlogs and, through sprint cycles, align the Des/Dev Ops teams to the planning timebox.

Next, I have listed the priorities of the creation (product discovery) and management (continuous delivery) process that I pass on to the team when I act as the scrum master of a project:

1 - Flowing and Information Architecture - I am naturally "addicted" to organization, so I take advantage of this gift to order the systems (pages, links, pop-ups, menus, etc.), focusing on the performance of the product.

2 - Logic and Intuition - I respect the limitations of the end user and, most of the time, my target audience are older people not so used to the web environment, so I am very careful with the deductive power of commands.

3 - Reading and Contrast - I think a layout with small fonts, light shades of gray and little contrast is beautiful, but not functional. I always try to remember that the user may have limited vision, either due to health or the circumstances of the environment around them.

4 - Responsiveness - It is not always enough to resize a project to adapt it to several different formats. You have to know how to edit the content to reduce or enlarge it, according to the shape and size of the screen.

5 - Client, Brand and Market - We can't let the user experience dictate the rules. Yes, the app/website is made for themselves, but it is essential to understand the client's brief, their brand guidelines, and how their competitors act in the market.

6 - Beauty, Animation, and Finishing - Visual appeal is extremely important, but it doesn't handle the product by itself. I see it as a beautiful wrapping with strong power of attraction.

Below is a summary of the steps, based on the UX page of my branding and design portfolio:

Management and creation steps:

Empathize - Understand who is the end user of the product, their story, their needs, their anguish and their daily life. Create personas for easy identification, "User Stories" and "User Journeys", which can be drawn as storyboards (big picture).

Define - Establish the main goal by stating the user's "key problem". It is essential to draw a map with all the project objectives, as well as the priorities and hierarchy of all actions.

Ideate - Competitor audit, definition of the biggest challenges to be fixed (Pain points), draw an affinity map, draft the first ideas (crazy-8s), create a storyboard of the application screens (close-up) and start the first wire-frames.

Prototyping - Set the information flow and architecture, for which device the layout will be formatted and from there, expand or reduce the proportions (progressive enhancement / graceful degradation), when necessary. Design the mock-ups in low and high fidelity and link all the buttons so that the user can test the prototype (or already a possible MVP).

Testing - Applying the Agile mindset through its frameworks, aiming at the product research plan, thus, each user will mark their answers and from there, will allow the usability study (monitored or not). Analyze each use case and seek new insights for function improvement.

Return - From this stage on, the designer goes back to designing the screens and can organize, together with their sqaud, one more "sprint" section for a greater concentration of solutions. The process is repeated until its completion. UX design has no end, it is a constant improvement.

Personas:

In theory, any and every usability design should be made for ALL PEOPLE. It is important to think about both diversity and accessibility that the app or site will offer. However, there is always a more direct target audience, which becomes the "persona" - a kind of fictitious character that illustrates the project's end user.

For example, an online toy store is focused on the children's audience, but it is their parents who are likely to make the purchase - that is, you can define two types of personas, or even more, such as grandparents, who are already older people and not as agile on the Internet. Depending on the case, in this same example, you can add as target the toys' producers and retailers as well.

Note: all the personas presented in this portfolio are fictitious. The people portrayed in the images are random photos and names I picked up on the internet, which have nothing to do with the made-up characters to illustrate the product's end user. If you are one of the people in the pictures and are uncomfortable with this, please contact me and I will change it immediately.

Wire-frames:

Wire-frames are a first phase before designing the final product. This "draft" makes it much easier to study the actions and links before spending time detailing the graphic design elements. These screens form a mock-up or low fidelity prototype.

The difference between the mock-up and the prototype is the functionality. The mock-up is a "single" screen, with no function yet. In a prototype, all the buttons, links, animation and transition already work. Both can be made for any format.

Responsiveness:

A responsive design is one that is developed to best fit the format of the device. The designer must create variations so that the information adapts to the size restrictions. In the old days, information was made for the desktop, so when it was reduced (only proportionally), it was barely legible on the cell phone.

The formats for responsiveness can be countless, from a 60-inch TV to a smartwatch, to a display on the dashboard of a car or even a refrigerator. A high-fidelity mock-up already shows the design very similar to the final product, just like its prototype.

Concluding remarks:

I see hundreds of UX portfolios all the time, some with fantastic designs, super modern animation and transition effects, super well chosen photos and illustrations, impeccable typography... but I see very little of the structure of the project as a whole, as well as it rarely shows the reason and target of the product, the architecture and navigation logic, as well as its weak points to be examined and corrected.

This is precisely the part of the entire process that delights me the most. Although I have a degree in graphic design, I believe that UI is just one of the cogs in this engine. I look for opportunities to work on the backbone of the project, exchanging directly with the client and bringing suggestions and solutions for the best functioning of the piece, including its branding, communication and outreach power.