Hi,
I have created a social media widget for websites. It fetches recent posts from connected social media accounts and show posts as popups/notifications in the website.
But I am unsure about that my landing page is understandable. I had spent a small budget on adwords, bounce rate was very high. There were some mistake on keywords so that's why I am updating them but before starting again, I want to be sure about the landing page is understandable.
Thanks in advance for your ideas and advice. You can check it at https://socialn.io .
"Embed your social media accounts on your website with striking notifications."
I think 'feed' may be a better word than 'accounts', but overall it's pretty understandable.
Thank you for your advice, I will update :).
Just FYI the "See Demo" button does not work in firefox. I have tracking protection on so I assume that is what is blocking it. I am not sure if there is any way around it.
This is what I see in the console
It works as expected on Chrome.
Hi, thanks for feedback.
I tried it with firefox, it seems working? These errors shouldn't block working of demo. Do you use any extension which may interfere with the content of the page like adblock?
I have ublock origin. It is weird, it seems to work the first time when I load the page but then there after when the button converts to the "See Demo" and I click it, it no longer works.
Did any other error occur on console?
When I click the button I see the following error
Hmm ok, I think your adblock extension is blocking Google Analytics js file and that's why it throws exception on See Demo button's click event which I am triggering an goal on the analytics side.
I will release an update ASAP, thanks for the feedback.
I just did a quick test. I turned off ublock for the site and still had the problem. Then I turned off Firefox track protection and the site worked. Looks like it is tracking protection that is blocking google analytics that is causing the problem.
To reproduce the error. Open the site in the latest version of firefox. In the settings (hamburger icon), turn on "tracking protection" and load the site. You should see the same results when you click the see demo button.
Great thanks, that will help a lot :).
Hi @bgultekin , nice idea. My feedback below
1.I love how you have shown a live demo, it works well on my laptop. No problem whatsoever.
2.I would suggest you look at websites like LapaNinja for inspiration for the colours and how the sections are designed. I am not sure the blue and green shade you've chosen works well. There's is nothing wrong but I feel it can be better.
3.Rather than focusing on the features, I would suggest you also have a section to explain about the benefits. I love the tool, if my business had social media I would want to know how the tool can help me. When you do the benefits section, you will also be addressing some of the customers pain points too.
4.Have a sign up section in the end of the landing page rather than the team section.
Overall the product looks good, when you browse sites like LapaNinja you will automatically know how much more potential your website can be improved design wise.
Hope this helps.
Thanks for great advices.
About colors you may be right, I consider to change it.
Benefits sections is a great idea I added it to TODO list.
Do you think there is no need for mentioning team at all or mentioning it somewhere else is better idea?
Best to mention the team in a separate page along with the about and why sections.
I went to your landing page on purpose without reading your post. Just looking at the header, I didn't understand what your product is about. The animation on the right side was not clear to me. My first impression was that someone was pulling this popover in such a grey block so I was waiting for the "snapping" animation.
After scrolling down then and reading the first feature "SocialN knows the best time to show notifications to your visitors." I understood what this graphic actually was showing.
I like the idea of this animation, but make it more explicit. Make more clear that the grey blocks are content. Or even use a real website. And the popover is moving too fast in my opinion.
The rest looks good in my opinion :) But the header is damn important since it's the first thing users see and then decide if they stay or stay not, so I guess you should put some work into that.
Thanks a lot. I kept animation basic, because there is also see demo button. But I think you are right, I should make it more explicit. I will update the animation ASAP, thanks again.
Yeah the approach is definitely good! I think animation is a really good idea in your case! Certainly you shouldn't overcomplicate the animation, maybe just make it a little bit more clear and then you are good to go! :)
The pop-up animation on 'Your Lively Website' is what helped me understand what's going on. You can consider scaling it up along with the pic on the left.
Thanks for the feedback. I am working on the animation.
Hi Bilal,
My team at draftss.com would love to give a detailed and constructive feedback on your landing page.
Just fill in the required URL and get started: http://draftss.com/feedback.html
Thank you for letting me know @JunaidBhai . I will do at a suitable time.
Hi Bilal,
The feedback response seems to have bounced back returning "The email account that you tried to reach does not exist. "
Nonetheless, here's the response on the feedback:
The first look on the landing page is definitely positive and wow!
The size of the text in the navbar could be a bit bigger
The line underneath each section "home, features...contact" is too lengthy; make it smaller. Small enough to fit FAQ text, this way on all other places it would appear shorter than the text, which should give it a more crisp effect.
Try changing the text inside Login and Signup button to capital letters
The main opener text and the diagrammatic representation of the product are also good, but both are utilizing almost the same amount of space. This is a distraction and confusion for the user subconsciously on which part his eyes should focus on first, which part is more important. You can try slightly reducing the size of the diagram to make it more impactful.
Coming to the diagram, the left side "Your social media accounts" isn't really needed. You should focus on making the gif on the right more better. The gif currently shows on Twitter widget appearing on repeat.
You can try a version where,
-- increase the size of the widget
-- make the widget with other social accounts as well
-- maybe for the sake of representation only you can show social media icon on widget where "your logo" is there.
Remove the See Demo button from the diagram and add it underneath the main text. Change the text from "See Demo" to "See Quick Example" or something similar, The word "demo" induces time lengthy activity in the minds of the users and it feels like more of the demo of the whole saas app, where in reality you are showing a quick example of how the outcome widget looks like, and thus you should really communicate something where people can quickly check how the widget appears rather than talk about a "demo"
Features Section
-- Increase the size of the icons, probably by at least twice as of current.
-- Remove the word 'Plan' from all the plans
-- In the Free Plan section, change 'SocialN Link' to 'SocialN Branding'
-- I guess for all of the pricing you support same platforms, so it is best to remove the platforms section from all of the pricing and maybe add a completely new section dedicated to a platform that you currently support. This section could be underneath the features section. Similarly, Responsive Feature is available on all the plans so that can be removed as well. The simpler the pricing the better.
.-- Remove the trial section from the pricing and add subtitle text where you currently have "We have plans for everyone".
-- A sample ordering of the feature list inside your pricing should be something like this: Notifications, Websites, Support, SocialN Branding.
-- Try changing the label text on Pro Plan to "Popular" instead of "Best".
-- The section to be very small. Maybe you should try adding more content.
-- the layout for the contact form is not really great. You can try making it more simpler.
-- Why is the logo different in the footer?
-- Add all the links from the navbar to the footer as well
-- Social media icons on your website should be more prominent as your product revolves around it.
This is pretty much what we think are the important aspects that need to be improved primarily. If there is any point in the report that you did not understand or want more clarity or needs to be discussed on any point in detail feel free to mail me back.
If you get the changes done and would want me to review it once again, I would be more than happy to do it.
Why don't you demo the notifications on the site itself? :)
Actually I am showing, is there any problem couldn't you see it?
Refreshed a couple of times, but still no luck. Using latest chrome.
That's weird. What about when you click the See Demo button?
Also, I would be grateful if you send me errors on chrome console if there is any. Thanks.
Demo button not working..
Thanks for feedback. Can you provide more information like your browser, any extension usage like ad blocker etc?