Hi everybody, welcome! This blog post is more of a case study to display my latest concept of the new Joomla Extensions Directory (JED). The reason I’ve designed this concept in the first place is that, in my opinion, the Joomla Extensions Directory can MAKE or BREAK the entire Joomla! Project.
Important note: Please note that every criticism I’ll post here, doesn’t mean in any case I think the JED team is doing a bad job. On the contrary, the JED team consists of volunteers who put their precious time into making the Joomla ecosystem better.
Stop Talking and Just Scroll Me to the Designs
The vast majority of Joomla’s users are not full-fledged developers, so they constantly rely on extensions to complete their projects. In my opinion, the current JED is not good due to two major issues:
- Lacking user-experience and interface – Browsing the JED and finding the right extension is not simple, and not fun. The interface is not user-friendly enough, the design is not pretty, modern or aesthetic, and it compromises the entire experience.
- It does not reward its developers – As an extensions developer, I’d not consider the JED as my top source of marketing. Introducing new extensions to the JED and getting traffic and traction is almost impossible. Even if the extension is magnificent. The reason for that is the poor rating system installed, the ordering of extensions in their category, and the fact there aren’t any promotions for new and noteworthy extensions in the form of a “Trending” widget or something else.
Issue number two worth dwelling into: In the real world, businesses are the sole innovators that drive the economy, communities or nations forward. It is the exact same thing with Joomla. If developers become discouraged from bringing the community forward by developing new extensions and improving the older, Joomla will die. And we can already start seeing this happening today. That is the worst thing that can ever happen to the project. The JED MUST BE a huge helper to the businesses who innovate in Joomla. If we succeed in that, Joomla will thrive almost automatically.
Before digging into the designs, please note that extension names, developers, scores or types may be incorrect, as I used these for display purposes only. If your extension is shown and you wish it wasn’t, email me and I’ll change it.
Here Comes the Concept!
I’ve considered both major issues of the current JED as listed above in the entire process, got some inspiration from Google Play and the Apple App Store, and have come up with a beautiful solution for the new JED.
Leading Colors
The website is flat designed and uses the colors of the Joomla!
brand (with slight variations). And three interface (UI) Colors.
Typography
For typography, I’ve used ‘Open Sans’ (free Google font).
An extremely readable and very popular free font.
Iconography
The icons are Icomoon’s Ultimate Package (I have a license, don’t worry) - https://icomoon.io/#preview-ultimate
Exposure Widgets
As I mentioned earlier, helping developers expose GOOD new extensions is key. Hence, a trending widget at the top, followed by a popular extensions widget, and a new extensions widget.
Expose extensions right from the homepage!
Your Extension Got Popular?
You Should Be Rewarded!
If you have created a good extension, one that tops the others, you should be rewarded. The new JED features you on its homepage, as a popular extension of a specific category, thus providing more exposure and helping your business (if it’s good) grow!
Category Pages
These should be focused on exposing as many extensions as possible and, provide new and noteworthy extensions their rightful place. The hero is shorter, you get filters, and scrolling down will constantly load more extensions (infinite scroll).
Exposure Combined with
User-Experience
The trending widget follows and shows the trending extensions from this specific category. Again – Exposure for new and noteworthy extensions is key.
In addition, enhancing the browsing experience is easy by adding a few filtering and sorting options to the page.
Extension Pages
The extension pages focus on two areas: Providing as much detail as possible on the extension (text, Images, Video, Q&A, Reviews and more) and again – more exposure for the developer’s business, and other extensions.
A New, Simple Rating System
Introducing a new and simpler breakdown of the score. The current system has many flaws, such as leaving support blank (because the user didn’t need any) immediately drops the total score.
A simple rating system with a full display of the score and reviews breakdown takes place.
In addition, submitting a review in the current JED is hard work. You need to sign up with a username (bad as is) and confirm it via email. Then fill out tons of fields. And on top of that, the JED website is extremely slow, so the entire process is frustrating, causing people to simply not add reviews.
Oh, and if you’ve forgotten your password It’ll take you about 10 minutes to recover.
Questions & Answers
A section with frequent questions and answers from the developer itself is a must. Users browsing for extensions usually leave the JED to visit the extension project page to find more answers. While this behavior is normal, we want to provide them as much detail as possible, so they can make better decisions and navigate more easily.
Developer Info
Again, the more exposure the JED provides to its developers, the more it provides help to their businesses. If the JED is a major help to developers’ businesses, we’ll have more developers, more extensions and more competition, which will boost the entire Joomla project.
My JED exposes greater detail about the developer, their website, and their business. And, it even features their Facebook page, website and other social pages right on their extension pages.
Interface Elements & Features
All the features to help users navigate easily.
Live Ajax Search Engine
An AJAX search engine (live search and results) is implemented. This search engine makes searching for extensions quick and easy. It features 6 leading results, and a button to open additional results (opens on the same panel with a scrollbar).
The search engine is a part of the header, so we can perform a search from any page of the JED. The search input grows when focusing it, providing better user experience.
It also features an option to filter and sort extensions by price, popularity, trendiness and more.
Discover Joomla
A panel that opens after clicking on “Discover Joomla” on the top menu. This panel features generally categorized links to various Joomla resources, as well as a download and demo buttons.
The panel is scrollable, so there isn’t a limit to how many links or categories we can put in.
Now, new potential Joomla users that visit the JED to explore its extensions, will have easy access to other Joomla related information.
Categories Dropdown
Clicking on “Browse Categories” from any page opens a drop-down of all the JED’s categories. This provides a quick and easy way to navigate through the JED’s enormous database.
JED Links Dropdown
Even though browsing through extensions is the JED’s main job, there’s a lot more to read, learn and do. This drop-down provides additional information about the JED, its team, and other important links.
Login / Signup Popup
We must make the login, password reset and signup process MUCH quicker and simpler. The simpler the process is, the higher the chances people will interact with the JED and submit reviews.
Social login options and an AJAX live interface for signup, login, and password reset, from a single popup, just like I have here on Ekerlabs should do the trick.
Extension Wishlist
A Wishlist is a feature the current JED already has. Thing is, I just discovered it this week when I was exploring the JED in depth to develop this concept. This means the Wishlist (favorites in today’s JED) is not accessible enough, which is unfortunate.
That’s it for now guys. Obviously, there are many more pages and elements that need to be designed. I’ve focused on the bigger elements and the most pressing issues.
Don’t hesitate to tell me what you think! You can do that here in the comments below, or on social media (I’ve posted this concept in some Facebook and LinkedIn Joomla groups).
Hope you had fun reading this!
Shir
Go Ahead!
I have seen many programmers and designers work over 20 years and I have to say, this is one of the best clean and straight forward UI and will definitely improve customer UX.
Reply to Joshuait would be a big improvement to the JED and also for the Joomla popularity,
Reply to Thomas K,i just posted the link to this site on the joomla Facebook group.
any news about this?
Reply to AntonioWould be a good idea to make sure that you and/or other people don't invest a lot of time into competing JED developments. See: https://volunteers.joomla.org/teams/extensions-directory-team/reports/679-jed-team-meeting-october-27-2017. Otherwise one party will have wasted a lot of development time.
Reply to JoergConcerning the current JED - IMHO one of its pitfalls is, that it is still more or less 'closed source'. And I think it is almost impossible to implement a perfect rating system. As an example, shopping carts come into my mind. For users who want to start their first e-commerce website, any simple rating algorithm will be misleading. Instead you would need a looooong questionaire to find out the shop's special requirements. Usually beginners have hardly any idea of what they need.
I can vote for another easy 1000x LIKES to this brilliant concept and design from Ekerlabs. It's so human-friendly!
Reply to Dwi RiantoLike it! Let's do it!
Reply to webgobe (Denes Szekely)I can't wait, the designs looks awesome and if it increase the speed and search results then it will be already better than the current JED.
Reply to Robert DamHope to see this layout online soon :)
Simply a great job! When we see it online? :-D
Reply to Simone BussoniThis needs doing so bad. The search function on JED is hard to use to locate an extension even if you already know the name of it., especially when they're poorly named.
Reply to JenniXGreat job.
Reply to KurtI hope JED picks up your work.
I'm also missing some emailmarketing from Joomla announcing new addons, promotions from developpers, new themes, a blog article, etc.
Like Magento and Prestashop do...
Kind regards.
First of all, I'd like to thank you, Shir, for the great work you have made!
Reply to Eugene SivokonThe current version of the JED is its Achilles' heel and as you said it can make or break the CMS, so the JED revision is a question of survival and you went beyond talking and offered a new conception.
Design layouts are very clean and nice and I like them!
Will the new JED version be based on a new extension?
You mentioned slowly pages generation and time breaks during the surfing. If it is caused by the CCK, then the best solution might be a migration to another CCK. If so, which one might be considered? It also will require doing something with extensions auto checker which must be implemented to the new CCK and redirect old URLs to new ones to save the traffic. (which is also a big headache due to over 8000 extensions)...
Looks great. There is not much I don't like from the designs. So great job!
Reply to Peter van WestenThis will solve a LOT of headaches developers AND visitors currently have with the JED.
Both on the visual aspect and the functionality.
Idea of a directory is that people can find what they are looking for as fast as possible.
Your designs definitely seem to underline that.
I like that the current weird and broken rating system is replaced by something that actually makes sense!
Also having a search that will finally work is long overdue!
I have a couple of questions and remarks:
1: I see there is a page for 'Popular Extensions' but not for 'Top Rated'. What will be the ordering for the 'Popular' page? Is that based on a combination of recent amount of downloads, reviews and review scores?
2: On the Extension Pages, the download button is under a list of less important details about the extension. It might be good to have the download button above that - especially on mobile - so people don't have to scroll and look for it.
3: The aspect ratio of the images are different between the different list views and the full image in the Extension Pages. This means the image will be cropped in different ways depending where the image is seen. Cropping can lead to all sorts of weird resulting images (extension names not fully visible, etc).
I would recommend you use one aspect ratio for all images in all possible lists/views.
There's going to be two different images to be uploaded for each extension. One as the smaller view (preferred the extension logo but not mandatory) and the bigger image.
Two sizes, perfect fit for every screen resolution.
Agree on having one aspect ratio in all views/layouts. As for the download button, I would rather position it above the Demo and Support buttons.
Great
Reply to JanI really like your concept. It's fantastic. JED is definitely needing a more user-friendly and well-designed approach like this one.
Reply to Tassos MarinosThanks Tassos,
Coming from a great extension developer means that it really is a good concept :]
Looks great & agree on the need to reward developers & that the existing review system is a little confusing.
Reply to EddieHi. It looks great. Good stuff. Peter van Westen from @RegularLabs and I were chatting on twitter the other day. The way Joomla interfaces with the JED and the ordering of search results is very weird. Try searching for any extension by name. You get 10 other things that is not even related to what you are looking for. I tracked it down, and eventually found out that the problem is not on Joomla core, but on the JED. I believe this is critical because of the convenience of being able to search the JED from inside Joomla.
Reply to Paul van JaarsveldYep, the ordering and searching Is currently not good enough and should change.
We need much better search. Not just on the JED website but also better search for "Install from web" feature in Joomla extension manager in the backend.
Reply to IgorYes, Igor is right !
Install from web needs improvement...
Thanks Igor, I definitely agree :)
Absolutely Brilliant design! JED should be rewarding for developer. Extension developers are suffering huge traffic loss from JED and there is no fair competition now.
Reply to Parvez AktherThanks, Parvez.
The concept is specifically designed to get developers more exposure :)