NCR Web Design — Kai Zhang

Service Homepage Mock-up

The design of the page follows the overall new design language of ncr.com with bold headers and good balance of white space and contents.

The page illustrates the features and strengths of NCR Silver. It also showcases success of NCR’s customers and the emblematic NCR Silver POS.

CXD Version 1

The styling for this page better represents the personality of the team, but it would take the developers a longer time to build.

CXD Version 2

V.2 is designed to accommodate for the current component package and capability of the developers.

CXD Homepage Mock-up

The two versions of CXD web page are designed and finalized to allow NCR web developers to utilize available packages and frameworks to build and maintain the pages.

The CXD team requests a unique design of their home/directory page. The page adopts a more diverse color palette and gradient applications.

Product Version 1

On this page, outlines instead of color masses, dominate. The long vertical line guides the viewers to navigate through the site, and circles highlight different anchor points of the page.

Product Version 2

The second version utilizes the overlapping effect to help viewers unfold information about the product.

Product Version 3

The third version uses the primary colors and vertical headers to create a zig-zag pattern, which is the natural way of human perception of visual information.

Product Page Mock-up

The three versions also provide three distinct directions for the design of product pages. Different design elements and themes are shown on different versions of the web page.

Event Version 1

Version one is the most conservative path among the three designs. The design elements as well as general layouts of contents is consistent with the new ncr.com family.

Event Version 2

The second version utilizes pin tabs and color blocks to cluster information. It also creates a floating effect that works perfectly with white space on the page.

Event Version 3

The last version introduces a visually simple and more coherent theme. Information is grouped up based on individual events.

Event Page Mock-up

The three versions of event web page provides three easily distinguishable directions for future event page design and development.

Check out how my design influence ncr.com