Redbooks - Anastasia Gleyzer

Graphic + UX/UI Design

Client: REDBOOKS (acquired by Winmo)

REDBOOKS is a B2B advertising and sales intelligence leader that takes the guesswork out of prospecting.

With over 100 years in the industry and formerly a division of LexisNexis, REDBOOKS was spun out in 2010 under management of new Principals, who devote themselves to positively disrupting the RB product offering and organization.

My role: Graphic Design + UX/UI Design

Team: Marketing + Product

Problem: The product website was out of date, overwhelmed and not user friendly. Responsive design (tablet and mobile versions) wasn’t developed at all and it was one of the biggest problem that we had to solve.

Challenge: The company had around 25 people. It was like a start-up environment where everyone was doing everything. I was entire Design department working with Marketing and Product team as well. The workload was pretty heavy, but it went with opportunities for learning and growth abound. It was a unique experience where I could innovate in many different areas at the same time.

Design Thinking Process

Research

I was working with Product team to share mission of explaining phenomena we observe in data. Our focus was making meaningful and interpretable inferences about data, relationships between variables, and explanations for changes or patterns in the data.

Sarah Mele, Product Manager, organized research plan involving all members of the company in the process. We had workshops and made different research together that helped us to create the right client personas.

Meeting Our Users

To make a great product we had to know our user. Our intellectually-dogged Product Manager, Sarah Mele, led the persona research with assistance from myself.

Home Page Redesign

Striving for consistency.

We needed to keep the same style concept to not confuse our clients with a completely different design. Users should not have to wonder whether different words, situations, or actions mean the same thing. Certain style of button should always do the same thing, or navigation should function logically, going deeper in hierarchy.

“Opportunities” Tab

This project was about data analysis & data visualization.

Working with a heavy data is not easy task. As a graphic designer and photographer I wanted to show all data more graphical. Created user personas, different researches and analysis allowed me to change my opinion. Perhaps, the final design looks pretty flat, but this is the way the company wanted it: not to use a lot of space for the graphical work and show as much data as possible. Big-data systems allow us to step back and see the big picture—a much more expansive picture than one person can see on their own.

“Features” Page: Z-Pattern

Users don’t read web pages, they scan.

Scanning means they only stop to read when something catches their eye. Eye-catching designs need psychology.

Z-Shaped layout is usually used in designs without much text, our eye starts scanning from top left to top right, then glances down through the content (following a diagonal) to the bottom left, before moving to the bottom right.

“Contact Us” Page

Responsiveness of the site was a huge issue for us. We were working with already existing site that wasn’t responsive and was locked on 1024 full width. I was trying to make some difference regarding it. We couldn’t change entire site at one moment. It doesn’t work this way. I made research about different platforms, softwares that people use and created the algorithm for our developers to implement it on the site.

Error Prevention & Simple Error Handling

Users hate errors, and even more so hate the feeling that they themselves have done something wrong.

I found that REDBOOKS platform didn’t have any error-prone conditions for the password entering that was a big issue. I made some research and designed the system that notifies users about any conditions before they can make a serious error. If an error is made, the system should be able to detect the error and offer a simple, comprehensive mechanism for handling the error.

New “Leads” Tables & QA

Data is useless without the ability to visualize and act on it.

Good data tables allow users to scan, analyze, compare, filter, sort, and manipulate information to derive insights and commit actions.

I created some design structures, interaction patterns, and techniques to display the best user experience.

Fixed Header. Fixing the row header as a user scrolls provides context on what column the user is on.
Line Divisions. Users may lose their place when parsing larger datasets. Line divisions help users keep their place.
Pagination. It works by presenting a set number of rows in a view, with the ability to navigate to another set. Pagination provides the ability to customize the row count per view.
Hover Action. The user needs to interact with the table to expose the presentation of actions.
Editing. It allows the user to change data without navigating to a separate details view.
Modals. It allows the user to stay within the table view but provides more focus to the additional information and actions.
Sortable Columns. Column sorting allows users to organize rows alphabetically and numerically.
Filtering. It allows users to manipulate the data presented in the table.
Filter Columns. This design pattern allows users to assign filtering parameters to specific columns.
Add Columns. This pattern allows users to add new “Lead List” column from a dataset.

Some examples of my Testing Notes.

We used Assembla to write and upload our testing documentation there. I think the best way to visualize all issues is to illustrate them using different colors. That would help developers to fix all bugs faster. In case of short deadline I wrote actual & expected results using screenshots or video screening to display all issues we faced on the particular project.

“Top Ad Agencies” Redesign and Responsiveness

Spinner Box Packaging Design

“RedAlerts” Tab Redesign

Alternating rows (zebra stripes) help users keep their place when scanning long horizontal datasets. Although they cause usability problems when there is a small number of rows because users may ascribe meaning to the highlighted rows.

Popups

I help users recognize, diagnose, and recover from errors.

It’s all about consistency. I write error messages in plain language, precisely indicate the problem, and constructively suggest a solution.

Lightbox Design

I always create some samples you can choose from.

Animated Banners

We want animated gifs (horizontal & vertical) for the advertising websites. It shouldn’t be more than 74KB each. Deadline is tomorrow morning. Can you make it?

REDBOOKS

Infographic: Sketches & Final Designs

It was my first project at the company.

REDBOOKS team asked me to create infographic for the Product Updates. They wanted to be sure that I would fit to the company because Redbooks focuses on a big data. I created many different kinds of infographic design while I was working in the company. I like mathematics so it was interesting for me to work in this particular business technology field.

Graphic Design: Flyers, Brochures, Postcards

"Search" Page UI

It was a quite challenging project.

I was working with Product team to revamping entire “Search” page in functional and design parts that would retain users. I had to efficiently structure content and create logical navigation while keeping the entire interface visually pleasing. I had to create newly added design patterns through the site. It included creating new icons, hover stages, popups, filters, tables, infographics, etc. The focus was to make use cases as simple as possible for all user personas. I removed all unnecessary tasks and highlighted important data so all pages implement fast and smooth.