August 29, 2021
About this submission
Client name
Webflow
Featured image
Description

Total time spent working on this concept was around 4 hours.

It's optimized for viewing on desktop and tablet devices (minimum viewport width 768px). It can viewed on mobile, but with limited functionality (currently you can see only pages without navigation and search).

There are X pages (email messages) made. Home, Featured and Search. Some of the elements are active / clickable (but not all) for the purpose of visual demonstration of this prototype.

The logotype will lead you to the start page. The search field is a real input field and the search button has the hover state, but there is no search functionality.

Next, there is the Compose button. When you click on it, a new mail modal should appear with some options that work. You can input text into To, From, and Message fields. When you click "Send", the form will send me an email. Also, buttons for closing New email box and minimizing are functional. The other buttons are not functional and have only "on hover" state.

The side menu with inbox, drafts and other items are also active only on hover.

Message list in inbox contains links to these pages / messages. This list is scrollable. I've designed this prototype on Mac, so default system scrollbars are visible when you start to scroll. I've tested how it looks on Windows (Chrome). There are default scrollbars, but all of them should be replaced in the final version with some custom scrollbars. I've put some "read" messages to show you how this state should look like. Also, I've used some info from your web to show you how the message list scrolls.

This design includes only split inbox view with the message list on the left and the mail on the right. Proportion ratio between the list and an open message is 40:60%

New message
From
Subject
Message sent!
Thank you!
Close
Oops! Something went wrong while submitting the form.