Newly designed CityU Mobile App v2

by Vicker Leung (OCIO)



It has been more than a decade since Apple launched the first iPhone. Since then, the growth of the mobile landscape has never ceased.  In 2018, there are 3.5 billion active smartphones worldwide, and it is estimated to reach 5 billion by 2023, which is equivalent to 65% of the global population [1]. There is no doubt that mobile devices have become a large part of our daily life.

Every year new mobile features and capabilities are released - Apple's FaceID [2], Google's App Actions with Google Assistant [3], and Samsung's potential foldable phone [4] to name a few.  To keep up the pace, the Office of the Chief Information Officer (OCIO) had embarked on a CityU mobile app redevelopment project a year ago, which was first introduced in 2013.  In August 2018, CityU Mobile v2 was released with significantly improved user experience over the v1, and at the same time v2 is endowed with new functionalities and architecture.


Design and Features

Once you launch CityU Mobile v2, the first thing you would notice is a grid of colourful module icons that replaces the previous single colour icon set.  The colour palette used in this new icon set was carefully chosen by our UX designer in order to bring up a bright and energetic mood for our end users, which is also coherent with the CityU’s new brand essence of being bold, energetic, and forward-looking.


The overall design of the application referenced Google Material Design [5] system.  A grid-based layout has been adopted throughout all the mobile screens and system icons, thus allowing a flexible user interface design across the modules while maintaining a certain level of consistency.  Everything is hand-crafted to pixel perfection to ensure a sharp non-distorted appearance no matter what pixel density is adopted in your mobile device.

Apart from changes in the user interface (UI), v2 also brings in new features such as "Room Availability" that shows you which rooms will be available for booking in the next hour.  It aggregates rooms from the Computing Services Centre (CSC), the Run Run Shaw Library and the Facilities Management Office (FMO) into a single mobile screen, saving you a tremendous amount of time in checking out each booking system individually.
Other new features include the examination timetable, an expanded staff directory, library loan records, integration with CityU Scholars [6], CityU CAP [7], CityU LibraryFind [8] and many more.


The Core Technologies

When CityU Mobile v1 was built back in 2013, the Adobe AIR technology chosen was the most capable hybrid mobile development approach at the time.  With the end-of-life of Adobe Flash being announced [9] and the performance limit of the Adobe AIR platform, we had to look for an alternative development platform.

After some in-depth evaluation that involves technologies like React Native and Xaramin, the open source platform Fuse Open [10] was adopted for the CityU Mobile v2 revamp. Having a mix of XML-based UX markup with separated JavaScript business logic, Fuse development is easy to pick up, highly scalable and maintainable. Since the source code will be compiled to C++ bytecode, the output application can also reach a near-native performance.  Comparing with v1, v2 launches 4 times faster, screen transition much smoother, while at the same time having a smaller application footprint than before.


Powered by IT Services and Students

Similar to the development of v1, CityU Mobile v2 is a collaboration between the CityU IT Services and our talented students from various academic departments. Our students could experience how to adopt design sprint, SCRUM-based agile development approach, collaboration through GitFlow, etc. In return, their involvement ensures that CityU Mobile v2 caters to both our staff’s and students' actual needs.​


​​What's Next

Shortly after the initial v2 release, a few minor versions have already been published with further UX enhancements and general bug fixes.  On our roadmap, there are already tons of features coming up, including car park availability, print quota enquiry, integration with Google Indoor Maps, and more.

Furthermore, to align with our mobile strategy of app consolidation as well as to further achieve our goal "With All You Need in Campus", CityU Mobile v2 will migrate functions gradually from other CityU mobile apps like AIMS, CAP, Student Orientation, Information Day, etc.

If you have not tried out CityU Mobile yet, download now through Apple App Store [11] and Google Play [12].


[1] Luke Wroblewski - Mobile Planet@Google Conversions event

[2] Apple Inc. - About Face ID advanced technology

[3] Google Developers - App Actions

[4] TechRadar - Samsung Galaxy X: the story of Samsung's foldable phone so far

[5] Google - Material Design

[6] CityU Announcement Portal (CAP)

[7] CityU Scholars

[8] Run Run Shaw Library - CityU LibraryFind

[9] Adobe Blog - Flash & The Future of Interactive Content

[10] Fuse Open

[11] App Store - CityU Mobile
[12] Google Play - CityU Mobile​