English
Piwik user interface new design: Give your feedback!
UPDATE: New design has been released in Piwik!!!
click here for more information
Over the last 2 years, the Piwik User Interface has not changed much in terms of design.
We are now excited to announce that the time has come to give Piwik a makeover – a new and improved look and feel designed to meet the following objectives:
- The new design should make Piwik more appealing and give it a more modern and professional touch
- The new design should fix the issues with the current UI
Some features are hard to use in Piwik. For example, the calendar and period selector is confusing and the website selector doesn’t scale well with hundreds of websites.
With these objectives in mind, Marcin Galecki has been working hard alongside the Piwik team on mock-ups of the design. These mock-ups haven’t yet been implemented, as this is still a work in progress and your feedback is important to us.
Note: click on the images to view them full size.
Dashboard
The dashboard mockup displays most new changes on the design:
- New menu
- New controller’s style used for the Calendar, Add a Widget
- New style for the website selector and language selector
- New style for widgets: colors, the footer, and tables scrolling to the right when there is too much data to display. We tried to improve the widgets’ footer to make it easier to access the other reports that Piwik provides: Advanced view to show all columns, ‘Goals’ view to see conversions for each segment.
Example ‘Referers > Overview’ report
This is an example of the “Referers Overview” report using the new styles.
Pages report
This mockup shows the style of the expandable data table, used in the Pages URLs and Page titles reports.
About Piwik message
By default, the message displayed would be short and sweet, and on Hover would display the full message.
Add a Widget selector
The “Add a widget” tool is now better integrated in the UI and re-uses the same styles as other selectors.
Website selector
The website selector currently does not scale if Piwik manages hundreds or thousands of websites and this new design would fix this usability issue. Only the first 10 websites (or 10 most recently used) would be displayed, and you could “Search” for websites (matching names and URLs).
Calendar
The calendar is a major usability issue in the current Piwik UI. In the dashboard mockups (see above), you can see that the calendar is now more visible. Also, the concept of Periods (day / week / month / year) is now directly integrated within the calendar selector itself, which makes more sense and makes it easier to use.
Icons set and widgets footer
Here are the full set of icons used in the mockups, and a detailed example of how the footers work.
Your feedback!
Piwik is currently used by more than 40,000 users, all with different backgrounds and objectives. The User Interface must accommodate the needs of every user from the most basic through to the advanced.
What do you think about this proposal? What do you like, and what could be improved?
Your feedback is really important to us – please send us your comments and suggestions via the blog or the forum thread and we will gather your feedback and contributions over the next 10 days or so. We will then work with the designer to prepare the final version of the mockups, which will then be implemented.
Thank you!
Matthieu Aubry
While studying in India in 2006, Matthieu had the idea of creating an open source web analytics alternative to Google Analytics. In 2007 he released the first public beta version of Piwik. Matthieu now leads the project from New Zealand, where he likes to spend his days coding new features from the Piwik Roadmap, and helping users and customers use Piwik effectively. Find him on twitter or github.
Subscribe to our rss feed: 
Posts or you can Suggest a topic to write about in the blog or See list of Features
Paul Bauer Says:
Looks much better than the old one! Can’t wait to test it out!
web-seitig - Pragmatische Websites Says:
the theme looks good: professional and clear layout. Not too aggressive colors. Modern and technical. Goog job.
Sumasearch Erfahrungen Says:
Danke sehr gut!
SEO Utah Says:
Search engine optimization is complex at times, in particular when google makes a modification or perhaps propose that they might make a shift in their own algorithm.
Love relationships Says:
It looks great! The design ist very clear and straight.
Great work!!!
tycoon cashflow review Says:
Hi I was just checking If someone could help me out with this problem, I view this blog a fair bit but sometimes the background keeps messing up and I cant read the text. PLease help me out
Brett Blevins Says:
Just updated to 0.9 from 0.8, and the date range selection is still broken on the Mac. I can only select an individual day, a single week, or a single month. No way to select a range of days, a range of weeks, or a range of months. If there is a way, I haven’t figured out how to do it. Same behavior with Safari 5.0.1 and Firefox 3.6.8. under Mac OS X 10.6.4. Also, in this form, the second field is invisible, and it evidently is the email field because when I left if blank the system said it was missing an email address.
Sascha Says:
Great job! Good, better … PIWIK! Keep on going!
emp Says:
This looks great.
One minor feature request:
Would it be possible to lightly shade Saturday and Sunday on the calendar views?
Susy Says:
I think this is a really big improvement!! Congratulations, I’m looking forward to installing this when it becomes available.
Matthieu Says:
Osama, yes we can definitely do better – if you know an alternative to the flash graphing package we use, feel free to let us know and contribute the code to make it happen. The main problem is the time investment into rewriting graphs, as the core team has many other tasks to focus on. But I agree ;)
Michael Konjevic Says:
The Design looks great!
One more thing: is it possible to get a more detailed view of the visitor location instead of the general overview sorted by country?
steve Says:
When its done? :)
beta Link?
Muzz Says:
As a UI designer, the new interface looks great. Implement!
ReneS Says:
Looks very good. Very clean and modern.
Blaise Says:
This is good news and i’m waiting for it to come.
xmRipper Says:
Hello, I know it isn’t ready yet, but I want to use this UI even though it is in beta phase. Please give us download link :)
BitConstructor Says:
Congratulations to the new design. It gives Piwik a much more professional look and feel. We are looking forward to the implementation of this design in PIWIK.
regards
Tibor
cray Says:
Would it be possible not to require the user the adobe flash player (for viewing the graphs)? http://www.highcharts.com/ looks good…
Anyway great work!
Sam Says:
This is definitely cool stuff! I’m glad you guys are working on this… was thinking of modifying the css but this GUI upgrade can do so much more =)
I hope that the widgets can span through 2 – 3 columns or the user can switch between 1, 2 or 3 column views. Not a simple change I must say.
When can we expect a beta download? =P
Mike Eng Says:
Looks good. One really small point for now: the font with the shifting baselines makes the digits under “feedburner statistics” hard to read. Also, the label for the “e-mail” field is missing for this comment form on Safari 4.0.4 / Mac OS 10.6.
jec Says:
ich freu mich schon sehr!
danke!
John Says:
Looks wonderful! I cannot wait to try it. :)
name Says:
Perhaps a poll would be helpful, to see how many people care for e.g. usability/performance/featureXY…
Me: Piwik looks awsome, but it’s using a lot of processing power. A high-traffic website would need a piwik cluster to handle all the callbacks :-\
Holger Says:
What I forgot to mention above, but it isn’t really a pure GUI issue:
We do not only need a start date, but also a end date. Day, week, month is not flexible enough in my opinion. Custom data ranges would be very useful (e.g. you can choose the last 3, 6 or 12 months, or 2 weeks, or 3 days, or whatever you want)
Johannes Says:
The layout looks much more professional. Good job!
This have nothing to do with the new layout, but it would really be great if you implement canvas graphs (or another alternative) instead of flash!!!
Juan Says:
Looks great, very professional. Greetings from Chile to the Piwik team!
Harman Gill Says:
This looks amazing. This interface looks a lot more presentable and easy to follow.
Great work guys.
Bill Says:
Please be sure to test the layout to see what happens when viewers enlarge the type. Some of us have difficulty reading small print and light grey text (or other light colours) on a white background.
Edward Phelps Says:
Great. Be sure to enable easy and well documented CSS edits. Theme support would be great.
Christoph Says:
The new User Interface looks good. I don’t have time for a deeper review, but to me it looks much better and easier to use than the current UI. Please go on and realize it.
Mike Southby Says:
Hey Piwik devs, really liking the new design, much more fresh and up-to-date. Looking forward to seeing it packaged soon…
Robert Says:
Looks much better than the old one! Can’t wait to test it out!
Judicael Says:
The new one is better than the old one though. But with everything on a white background, it does not enhance the reading experience.
Alinux Says:
Absolutely what we are looking for.
Great job guys!
Phyton2706 Says:
The new look is much better than the current one!
I can`t wait for the new release!
KKovacs Says:
Woot! Looks great, guys! Can’t wait to see it on our own servers!
bee Says:
A real improvement!
I’ve started tracking my website with etracker, and my favorite dashboard information is that I can see today’s AND yesterday’s visitors + PI. ‘Any chance to see both information at the piwik dashboard at the same time, as both information are valuable to me?
Arvind Says:
This looks good and well organised.
Great work guys.
-
Arvind
Tech Executive
Steffen Says:
This is a great new GUI!
Patrick Says:
Finally; seriously it was long over due; the above design looks a lot more professional. I would also advise to change the logo; because frankly that is long overdue as well.
While these things are not the most important (the application needs to do what it is supposed to do first) it is very important to grow the community; because LOOKS sell.
Felix Rieseberg Says:
This looks *awesome*. I came here to tell you guys how you should do it, but this is just great. Can’t wait for a release!
Liang Says:
Currently I found it took some seconds to show the widgets. So if you change it, please also make it a little quick.
ConnyLo Says:
Cool, wanna get this!
GENiALi Says:
Just cool.
Where can I download the new interface? :-)
Thomas Bachmann Says:
@Panos: I think there is no reason for themes in a website analytics tool. Do you have one specific?
Smepq Says:
Take a look at this really good UI:
http://www.collabtive.o-dyn.de/demo/index.php
good example how the implemented tooltips for every symbol, how they made the dashboard and the other content boxes
greetings, Smepq
laurent Says:
The updated design looks great. Only one comment – can the main color for text and lines be made configurable (with CSS or new settings) ? I find the switch to orange as the main color (instead of blue) makes it difficult to distinguish alerts from regular text.
Panos Says:
It is great the new look.
I would suggest to have themes support.
Thomas Bachmann Says:
Great improvement, but maybe too close to Google Analytics.
What would be even more important in my opinion is speed improvement and a possibility to save custom display options (graph type).
Ben Says:
The redesign looks excellent. The one thing letting piwik down as a whole was the “dated” feel to the UI. That is a massive improvement! Good work. I can’t wait to see it in action.
Thomas Bunte Says:
The new GUI looks more tidy and “user-friendly”.
Great work!
Only a small detail could be better: imho was the icon for export not 100% clear.
Samalah Says:
I think this is a really big improvement!! Congratulations, I’m looking forward to installing this when it becomes available.
robo47 Says:
really looks great.
Ahriman Says:
Looks great :D
Tim Says:
Simply Fantastic. It’s now pleasing to look at now as well as the power of Piwik analytics on the backend. This is a much needed make-over.
Job well done! I can’t wait for the update.
Maksin Says:
Cooool, this is what we have waiting for.
Good. :)
Hans Nordhaug Says:
The new UI looks great. I don’t have time for a thorough review, but it definitely looks much better than the current UI.
Greetings from Norway.