Videosly

Videosly is an app that helps content creators to generate informative videos. Our team decided to work on this project to create our own videos quickly for marketing instead of depending on a video editing professional and shelling out money even for very small projects.

Once we started using it, we were confident that we had created a product that was too good to be held back, we launched the product.

I worked closely with developers defining a the user flow and visual design for every step that the user would take to create his/her video.

Here’s how it works

1. Name your campaign.

2. Add your content or grab it from a blog. In this case, Quotes from Walden by Thoreau .

3. Add related videos from the inbuilt library or you can upload your own videos.

4. You can also use these videos to capture leads

5. Publish your videos in popular formats.

6. Grab a coffee and wait for the videos to render .

7. A link will be generated along with an embed code for the users to share the video.

Engage Chat


I worked with a small team of developers to create the app that is beautiful and simple to use.  I also designed the branding, landing page and other marketing materials for the product launch.

The Challenge

Owing to a very short launch deadline, I had to come up with an interface design for the product, creating wireframes and doing quick usability tests in the process.

The biggest design/usability challenge I had faced was to come up with an alternative to the usual flow diagrams that were being used on most of the apps to create chatbots.

The Process

We decided to whip up an MVP and had to reduce the time spent for some of the UX research processes.

Identifying the audience

After our initial research, we narrowed down our target customers to be online marketers who wanted to capture leads and sell/promote products through email marketing rather than for customer support for which the chatbots are commonly used.

Competitor Analysis

Since chatbots were in their early stages around a year back, I had to do some extensive research on how they were being built and implemented by other companies and how receptive the people were to this new concept.

The Work

I started by creating user flow diagram and wireframes/low fidelity mockups of screens in the app.

The Design Challenge

Coming up with an alternative to the flow diagram used to build the chatbots was a major challenge. While I was working on the alternative, I had asked the frontend developers to work on the other screens on the app. We also did an internal user testing once each section of the app was completed. Most of the chatbot builders in the market were ( and are still ) using flow diagrams like the one shown here. The major problem with this is that the process gets confusing after two or 3 levels of conversations.


Solution

Since flow diagrams were going to be confusing after two or three levels, my solution was to create a system that works like a Live Editor. All the conversations, CTA can be added to the bot while having a live preview of how it looks.

Design

I created high fidelity mockups of all the screens using Affinity designer and the bootstrap framework for most of the components on the app.

I designed the interface with this statement in mind

“Your objective should always be to eliminate instructions entirely by making everything self explanatory

Don’t make me think by Steve Krug
Individual User Statistics

I was also responsible for designing the UX for visitor statistics. The page owner can click on the specific user (if there is an email id) from the dashboard and have a look at each step the user had taken, every click he had made to get an idea/feedback on the visitor behavior. This feature was also used as a split testing platform by some customers!

Branding

I was also responsible for designing the brand identity, landing pages and other marketing materials like Facebook ads and banners for the product launch.

Result

We started our project to come up with an MVP for the launch, but we ended up creating a polished version of the app that delivered it’s promised purpose.

We now have over one thousand users from all around the world.

PS: With some feedback from our customers, we were able to roll out 2 more updated versions of the app by adding some cool new features like multiple language support, animated backgrounds on pages, Split-test features and more.

Quick Demo

Videosly

Videosly  is an app that helps content creators to generate informative videos. Our team decided to work on this project to create our own videos quickly for marketing instead of depending on a video editing professional and shelling out money even for very small projects. Once we started using it, we  were confident that we had created a product that was too good to be held back, we launched the product.

 

I worked closely with developers defining a the user flow and visual design for every step that the user would take to create his/her video.

Here’s how it works

1. Name your campaign.

 

2. Add your content or grab it from a blog. In this case, Quotes from Walden by Thoreau .

 

3. Add related videos from the inbuilt library or you can upload your own videos.

 

4. You can also use these videos to capture leads

 

5. Publish your videos in popular formats.

 

6. Grab a coffee and wait for the videos to render .

 

7. A link will be generated  along with an embed code for the users to share the video.

 Here’s the sample video:

Website Design for a Travel Agency

I was responsible for designing the website for a startup travel agency. The client wanted the site to be as minimal as possible.  My solution was a single page website, that utilized slider transition to the maximum.

As the client had a very limited option of tours while designing the site, I used accordion navigation menu so that they can add many more tour packages without changling the website layout .

Hypesprout

A landing page (more specifically called the JV page in the affiliate marketing world). These pages are notoriously long. This is my take on making the pages shorter and easier to use.

I wanted to try a paper cut illustration on the landing page and  used material icons to create this perspective illustration on the header section.