kulesza.io project hero img

ReactGrid

ReactGrid is an open-source React component for displaying and editing data in a spreadsheet-like format. It's fully customizable and extensible, allowing any cell type to be placed anywhere in the grid. ReactGrid provides a consistent experience across desktop and mobile devices. As an open-source project with an MIT license, it's free for both personal and commercial use.

Project scope

TIMEFRAME

01.2021 - 02.2021

TOOLS

Figma
Adobe Illustrator
Jira - project management
Google Meets - interviews and testing

DISCIPLINE

Brand design
Web design

RESPONSIBILITIES

  • Design a new logo and key visual,
  • Prepare brand guidelines and style guide for the website,
  • Create illustrations and icons,
  • Design a new website.

Context

ReactGrid is Silevis's flagship open-source product, embodying our expertise and innovation. It was officially released and primarily used in internal and client projects. However, despite its growing popularity, the product's discoverability was poor. It needed some graphic enhancements to become more recognizable. There was a clear need to develop general branding and refine the website.

Logo

Before preparing logo concepts, I conducted simplified interviews to gather insights from key team members: developers working on ReactGrid, the product owner, and those involved in promotion.

The survey revealed that ReactGrid is best described by these values or associations:

  • reactive
  • configurable
  • dynamic, responsive, flexible, elastic
  • grid, table
  • spreadsheet-like

The color palette was chosen to evoke similarities with Excel or Google Sheets, reflecting the grid's interactive nature and potential applications.

Website refinement