TYPO3 Neos – Ready for production?

30 June 2014 Comments Off

TYPO3 Neos logo

TYPO3 Neos is the next-generation open source content management system made by the TYPO3 community. Neos is based on the PHP framework TYPO3 Flow.
There was & still is a lot of hype lately around the new TYPO3 product, TYPO3 Neos, that makes many people ask one simple question: Is TYPO3 Neos ready for production? For different clients, with different needs, for “impossible” projects?
Many TYPO3 agencies ask if Neos is ready for production. We will try to answer, from our direct experience gathered while implementing several Neos projects

TYPO3 Neos hands on - Case Study #1

Naturally, we were excited when we saw the first opportunity to propose TYPO3 Neos as a solution for a small local institution that had an old website on a deprecated platform. The reason we chose to go with TYPO3 Neos was a combination of eagerness to try it on a real world project and also because it really fit well with the needs of our client. Our client’s editors were people who weren’t technical at all, people from the medical sector. TYPO3 Neos is a perfect candidate for simple editor:

  1. Simple editing method
  2. Short learning period
  3. No training required
  4. Intuitive use

Having experience with TYPO3 Flow was also a factor when we made the decision for TYPO3 Neos because the CMS itself is no more than a TYPO3 Flow application.

TYPO3 Neos 1.0 was the starting point for us and during the development we saw how easy custom elements can be created with the power of nodes & TypoScript 2.0. But what hurt us the most was the acute lack of documentation. Finding the right documentation was not a matter of looking into wikis, but mailing lists or even IRC chats on Freenode channel #typo3-neos
That can be really frustrating, but with lots of coffee & patience that can be overcome.

The project didn’t hit us with any surprises and development went really smooth despite that fact that it was a new CMS for everyone involved in the team. Version 1.0 was buggy especially in the backend, problems usually occurred with the editing of content, most of the times exception were thrown if the user deleted content in some cases.
After delivery we were surprised that the client didn’t need any training, everything was so intuitive for him that content was added by editors without any help / training from our side. Impressive.

TYPO3 Neos hands on - Case Study #2

Another project that came to us as a explicit request for TYPO3 Neos, gave us the opportunity to test drive the freshly released TYPO3 Neos 1.1. We must say that the Neos team did a great job making a more stable version, problems that usually occurred in backend were fixed and a great improvement in performance was very welcomed. Also, some new minor features were introduced, like node type switching, which was badly needed for editors.

But the localization & translation are still missing from the backend, although the foundation was set already in 1.1. For now, the easiest way to do multilingual websites with TYPO3 Neos is to use the old fashion way that was used also early on in TYPO3 CMS, different page trees for each language. The TYPO3 Neos team promises to deliver Content Dimensions, an alternative to the translation handling that currently exists in TYPO3 CMS. The content dimension concept is the foundation to work with different content variants and have a very flexible localization solution in Neos. The user interface to work with content dimensions and translations will be part of the next version (1.2).
For example, you can have more than languages, you could make variants of a content element for people ages 13 -25 and other variants for people ages 26 +. This cool features will help websites present relevant information not only by language, but also depending on the website user characteristics.

Getting back to our project, integration of template was easy and even if the website was multilanguage we managed to get by the missing translations infrastructure quite easily.
Since the website was responsive, we needed to target different devices and here our experience with Flow / Fluid kicked in. This is one of the advantages of TYPO3 Neos for agencies that are working with Extbase / Fluid / Flow is that even if they never touched it, it will feel familiar and custom plugins will be no more than simple packages. But most of the time you won’t need dedicated plugins, like extensions in TYPO3 CMS. Nodes & Fluid are extremely flexible that in most cases you won’t need a plugin.

TYPO3 Neos & Deployment

Another aspect that we love about TYPO3 Neos is deployment. Having from the start each website as a Flow package is just awesome, during development and also after. Working with a team under VCS is extremely easy and once you are done, all the content can be exported into a single XML file. No database dumps, we just installed a fresh Neos on the clients server and installed the package, et voila! Everything was working perfectly.

Production ready can have different meanings for different people, but some key factors are still missing:

  1. Translation / localization
  2. Multi domain support
  3. Documentation

Once all the above are stable and in good shape, we can state that TYPO3 Neos is indeed production ready.

Conclusion

TYPO3 Neos is already good for small presentation websites, we are glad to see how easy the inexperienced editors get to manage the content with Neos and we believe that given time it will have a bright future.

We believe in the power & concepts that TYPO3 Neos brings to the CMS market and with the new skills we acquired, we are ready to deliver TYPO3 Neos projects!

Author: Tomita Militaru

 

CASE STUDY : IdentityZ.com – a social network

5 September 2012 Comments Off

In the recent years, the Social Networks revolution changed the way we gather, interact and exchange information, and the online Communities thrive, bringing new value to organizations and products. We all know models of success, and we all use frequently at least several social networks.

Yet, each community is different, each organization has its specific, which derives from the special nature of the needs and opportunities that its members seek to be fulfilled.

Considering the launch of a new Social Network, it is imperative to find innovative ways to bring additional value for its members to be, because the members have to be attracted to the new community, they have to be engaged, encouraged to interact and to stay active permanently. The challenges are conceptual (find new, better ways to fit the needs of the requirements of the members), but also technical (incorporate the newest technical trends, find the most performant technical solutions). Bellow you will find the story of this endeavour, from our perspective, as web agency.

Main requirements

  • 1. Create a web platform which can be scaled when needed
  • 2. Define the architecture of a web application which allows the user to manage a lot of content types: profiles, contacts, albums, images, videos, documents, blog posts, comments, messages on the wall, personal messages, etc.
  • 3. Permanently improve the user experience on the site
  • 4. Simplify the functionality as much as possible to be easier to use

Technical challenges and solutions

  • 1. The application is implemented using Zend Framework
  • 2. Different uploads
    • – to allow the user to upload more video types all the videos were converted to flv in background and displayed them using a flash player
    • - multiple image upload using flash
    • - “on the fly” image upload
  • 3. The privileges management for the content elements and profiles
    We had to figure out a system which allows the user to share the same content element on more profiles and to share his/her profile with other users. When a profile is been shared, all the content elements present in that profile have to be shared as well with the owner of the second profile. The user has the possibility to change the shared profile with another user any time he/she wants by dragging the user from one profile column and dropping to another. The operations regarding the granting/revoking of privileges are handled in the background.
  • 4. Infinite scroll for all the available contents: wall messages, images from albums, albums list, blog posts
  • 5. Profile image upload and crop
    The user can upload the profile image using the so called “on the fly” image upload and then he/she will be able to position the image in the square as he/she wishes and can crop the desire parts of the picture using the pre-defined crop zones by drag & drop.
    Upon save three kinds of images will be cropped:

    • - one for the profile’s header
    • – one for the Home page
    • – one for the image that will be displayed on: comments, wall messages, search results

    We use ImageMagick for all the image operations: resize, crop, rotate.

  • 6. Search
    The main search combines the site’s contacts (public profiles) with a Facebook search (using Facebook Api), having the posibility to invite the Facebook contacts to the IdentityZ website.
  • 7. Drag & drop
    One of the biggest challenge regarding the user interface was the drag & drop functionality. In order to improve the user experience on the site, drag & drop is introduced on different elements: pictures, contacts, files, mails.

    • – the user can drag & drop attachments to the messages sent to other users
    • – the user can choose which identity is showed to another user from his/her contacts, this can be done using drag & drop to change the column where the contact is displayed
    • – the cover of a blog post can be set by drag & dropping the desired image
    • – mails and files and contacts can be moved to another profile by switching profile columns

    See the images for examples.

  • 8. Facebook and Twitter profiles
    These profile types will ask the user to provide the Facebook / Twitter account info and in order to retrieve all the contacts to the IdentityZ profile. After the profile activation the profile’s owner will be able to publish messages on the Facebook wall / Twitter directly from the IdentityZ account.
  • 9. Wall & news
    The wall contains all the messages generated by the system when another user takes and action to that profile: comment on blog post, comment an image, tag a picture, create an album, create a blog post and so on.
    The news collect all the messages generated for the logged in user and his/her contacts.

There are many more interesting features of the system, which are available at identityz.com. And stay tuned, more will come, to enhance even further the experience of the users.

The challenging nature of the user interface and the high level of complexity behind this social network infused us a dose of deadline related panic, but, at the same time, creating the site was a lot of fun and indeed an interesting job.

A social network system is always an opportunity to try new concepts and strive to meet up with the latest trends. An active system of this nature is always evolving and transforming, not just through the contribution of its community, but also with new concepts, new functionality and continuous improvements in the usability and performance of the features. Our aim is to actively continue to deliver the best solutions to the system, and apply the lessons that we have learned in order to bring extra value to our customers, in all the projects that we make.

CASE STUDY: Unica.ro – an online community for women powered by TYPO3

14 April 2010 Comments Off

Unica.ro is considered one of the major online projects of Ringier Romania. Currently among the top ten online portals focused on lifestyle in Romania, the website wants to gather a consistent and active community of women to which to offer relevant and up-to-date content.

Main requirements

Our customer approached us with the following list of main requirements:

1. Create an environment where the targeted segment (women) can find relevant content (news, photos and videos) displayed in an attractive format, highlighting the updates.

2. Create an active community, by stimulating the users activity and feedback (adding comments, casting votes, posting in the forum section, participating to surveys, use the internal messaging of the website, creating own albums, etc.). The users are enticed through a system which rewards active users with points.

4. Give and receive opinions to personal issues, by creating a section where the users can ask the feedback of the community about a certain problem (with a functionality similar to Yahoo! Answers).

5. Create a complex astrology section, where one can find the predictions for the current day or year and also can find the compatibility between signs.

Technical requirements

- Use of TYPO3 version 4.2 as a development framework and also as a backend.
- Due to short implementation time and to budget restrictions, public extensions were to be used wherever possible.
- Custom extensions would need to be built for the functionality where we couldn’t find suitable public extensions.
- AJAX technology would be used in order to create a smooth user experience through the interface.

Technical challenges and solutions

1. Implementation using public extensions with respect to the TYPO3 CGL.

Taking into consideration that certain public extensions do not implement TYPO3′s extending methods (for example cwt_community does not use HOOKS or XCLASS) or, in other cases, the separation between the PHP and HTML code is not done at acceptable standards (for example simplesurvey), we have decided to create new extensions, based on the code and logic of some public ones but modified in order to implement the project’s specifications and in the same time apply to the TYPO3 CGL.

2. Using AJAX technology combined with some public extensions that are not implemented using it.

As an example, we’ve used AJAX for adding, replying and browsing the users commentaries of the articles. Originally, this functionality is implemented in TYPO3 using the comments extension, which doesn’t use AJAX.

Implementing custom extensions that use AJAX technology was an interesting experience (voting extension, poll extension, Yahoo! Answer like extension). We tried to use the xajax library using some public extensions – xajax, taxajax, tdo_xajax – but we’ve encountered the same problem: if more than one plugin using AJAX was displayed on a page, only the first plugin worked as expected. Also, when making a request, a lot of unnecessary code was executed in order to create the proper answer. Finally we’ve decided to make the AJAX request using our own JavaScript implementation combined with TypoScript configuration, to avoid the execution of unnecessary code.

3. As the client requirement was to create complex relation between different data types, finding a solution for an easy, fast and user friendly relationship building was a major issue on which our best solution was to use IRRE (Inline Relational Record Editing)

4. The large amount of records added by the editors raised the question of a fast retrieval of a given record. Creating custom backend modules with advanced search filters was a successful solution.