As product designers, we are always finding a way to make our design process more seamless. When working on various deliverables and adhering to a timeline, we are always looking for a more efficient way to use Sketch. With the following plugins, there’s no doubt you will be able to produce pixel perfect designs quicker and more efficiently.
As a product designer, it is common to focus on visual design and forget about copy. Personally, when I am producing deliverables I tend to overlook my grammar and have always been dependent on Spell Check on MicrosoftWord or autocorrect when using iMessage. While visual design is a major component in your product, copy is usually overlooked. For those who tend to misspell words when including copy, a great plugin for Sketch is Spell Check. It is a simple spell checker that checks all the layers of your Sketch file. Once extension is ran, it will produce a list of texts that contain errors or an incorrect word. Very useful for those who have to sound out ‘Wednesday’ before typing it out.
For those that like to view their prototype as they design, this is the plugin for you. Craft plugin for Sketch allows you to preview your prototype as you design and also sync your artboards to Invision. When working with various stakeholders who request for an interactive prototype, the Craft plugin also allows you to copy a link while still working within Sketch and forward it to those who want to see your product. After syncing using the plugin, you can then go into Invision and view the artboards you created in Sketch as a prototype! Start adding your hot spots and you are good to go!
With Fitt’s Law emphasizing the importance of size and distance, Nudg.it allows one to design while practicing this law. It has been said that components in a design are more visually appealing when spaced out by 8 pixels. Not only does this plugin allow you space your components out with the simple click of a shift + arrow but it also helps you keep spacing consistent throughout your designs as well. When using Nudg.it you can select the amount of pixels you would like to space your components out by. After managing this setting, you can start nudging! You can set your “small nudge” and “big nudge” settings to ensure elements are spaced consistently. This also helps you save time by avoiding the tedious clicking, dragging and dropping around your artboard.
Copy and Paste Guide
One of the challenges I have faced as a product designer is maintaining consistency in my designs when designing for multiple screens/pages. To ensure components are aligned I set an initial guide for myself. If you are new to setting guides, they are those red lines that run vertically or horizontally throughout your artboard. I personally use them to ensure components are aligned. With the Copy and Paste Guide you can set your initial guides and when switching to another artboard you can paste those guides that you have set.
If you are looking to save yourself some time when changing the background of elements within Sketch, Paddit is the plugin for you. Sometimes you might find yourself changing the background of your components to adjust to your art board’s background. With Paddit you can simply group your elements together and change the background from there. Now that you no longer have to adjust the background for each individual component, you will be saving so much time and be able to move on to your next task!
These are just a few of the many plugins available for sketch. If you are already familiar with these plugins you can also check out Sketch’s website for an extensive list of plugins from third-party developers. Now that you possess more knowledge on how to design more efficiently in Sketch, download away!
- Jackie Chan is a UX/UI Designer at Perpetual
With so many fonts to choose from, what are the top fonts out there right now? You are probably already familiar with fonts such as Times New Roman, Arial, and Roboto but did you know these fonts are classified under two different typefaces? These two typefaces are known as Serif and Sans Serif.
Is serif trendier than a sans-serif? Let’s start with the difference between the two. Serif fonts have lines added to a basic character (such as Times New Roman) and sans serif is a typeface that does not have those small serif lines at the ends of the characters.
Serifs are known to be classic and traditional. The following are a few of the top trending serif typefaces out right now. Previous trending serif fonts included Saonara, Coachella, and Libertinus. Now let’s take a look at the “it” fonts of 2020, shown with examples below.
Sans Serif is associated with being modern and contemporary. Previous sans serif fonts included Avenir, Helvetica, and Roboto. Popular fonts of 2020 include the following:
Avenir Next Pro
Pairing the two typefaces together are also very common. When doing so, the rule of thumb is to use a sans serif for your header font and a serif font for your body. Keep contrasting font weights in mind to help distinguish hierarchy for users. A great resource for font pairing is FontPair and Fontjoy where you can view how fonts would appear paired together before implementing into your design. With that in mind, ensure that you have defined the purpose and mood of your design and then select fonts from there. For example, you wouldn’t want to use a curvy Comic Sans for an email to your client.
Now that you are aware of what fonts are trending right now, how does one stay up to date you might ask. Google Fonts is a great way to discover great typography. With their extensive catalog of web fonts, you will definitely be inspired and discover new fonts to use for any design project. Another great resource for typography inspiration is Pinterest. Creating a board dedicated to typography and following Pinterest users who contribute to the Pinterest community is a great way to see how others use font pairing as well and what is trending.
Now that you’re up to date and possess font pairing knowledge, you are ready to design with stunning typography!
- Jackie Chan is a UX/UI Designer at Perpetual
As app developers, we aim to be at the top in the exciting and competitive global app development market. Success in app development depends on what competitive edge we can offer to our customers. If you don’t have a competitive edge to offer compared to others in the industry, your app will likely be ignored in the app stores. So, how do you develop the app that is downloaded by users and recommended to their friends?
"Successful people do what unsuccessful people are not willing to do. Don't wish it were easier, wish you were better." - Jim Rohn, Serial Entrepreneur and Best Selling Author
It’s essential to start off on the right foot with top practices for app success. These may not sound intuitive or your logical next step, but will definitely improve your app development process. Build your app’s competitive edge by following these best practices in app development for 2020.
1. Comprehensive Research
Research is the first thing to do when planning an app’s development. Effective research in itself is a best practice in application development. It involves exploring features and priorities from trivial to complex and not ignoring any aspect that could affect any areas of application development. Start by researching your audience, their preferences, demographics, age groups, etc. Your users are the highest priority so it’s crucial to make sure you appeal to them!
Similarly, performing competitive research on your competitors to find out their strengths and weaknesses is key. Additionally, it is important to ask key questions about your competitors such as what apps are they developing? Is your value proposition or offering any different or unique compared to theirs? Doing this will help guide your line of questioning throughout the research process. Also, try to identify the challenges faced by them, and be prepared to find a solution to these challenges for your own offering.
The data collected from the research should be used for planning application development. So, make sure that you gather as much relevant, accurate, and precise data as possible.
2. Minimum Viable Product
A successful application must have a core functionality and features that support it. Too often, features and functionality confuse the user and also make the app heavy. For example, the user doesn’t expect a banking app to have games.
As a result, the biggest challenge in app development is to decide the features and functionality to include. A unique offering, supported by connected and relevant features, is the ideal choice. Limiting the scope of the application also helps you focus on building a high-quality app with the targeted functionality that you’ve pre-determined through your research.
To start, make a list of features for the app, and categorize it into mandatory or desirable (A good pattern to follow is the MoSCoW method : Must-have, Should-have, Could-have, Won’t-have). Then develop and release a minimal viable product to test your app in the market. Developing an MVP is quick and cost-effective with many included benefits. The feedback on this MVP app should be collected from your users to evaluate what to include in updates and make better informed business decisions down the line so you we can continue releasing better versions of your app after live-testing the MVP.
3. Effective Use of Technology
Choosing the right technology to use in your product starts from the app planning stage itself. Depending on the targeted audience, you must first evaluate whether to develop the app for Android or iOS (or both). Accordingly, this decision allows you to choose the best framework and language for app development.
At this stage, depending on your requirements and budget, you must also decide if you want to use open-source solutions for app development or go for customized development, or a combination. For simpler apps, you can also go for low-code or no-code app development.
4. Interactive Prototypes
A crucial component to creating a great app comes from exceptional design. If you have
designed well, you’ve made a good start at setting your app up for success. Winning app design focuses on user experience and user interface. If the user finds your app convenient to use, you have won half the battle.
Navigation is also a crucial element of app design. If the navigation is not easy, the user cannot access what they want in the app which will inevitably end with them reducing their usage of the app and eventually uninstalling it.
The best way to ensure the success of your app design is to create an interactive prototype. This helps keep the client and developer on the same page before any app development begins. Also, this is useful for testing your design and rectifying the deficiencies ahead of time.
5. Intelligent Budgeting
The best way to manage your app development funding is to make a budget before development begins. This budget is based on many factors so you should list down the features and functionality required in your app. Apart from that, it helps if you also set a timeframe for development. If developing the application is urgent, it will cost more to develop.
This planning doesn’t end here. To be able to make a reasonable budget, it is also important to estimate how much you can price the application. This will depend on the audience and market demand as there is no point in developing an application with very high costs and no returns on investment.
With that said, it is crucial to be pragmatic while budgeting. For high-quality complex apps, you will need a reasonable budget; nothing comes for free!
6. Don’t Ignore Security
No matter how well-built your application is, if it is vulnerable to security breaches, it will fail.
The list of best practices in application development cannot be complete without a mention of security. There are various ways to make your application more secure. Depending on the technology that you are using, you can manage security during the development stage itself. You must also ensure that you use authorized APIs for app development.
Apart from that, you must also take appropriate steps to ensure data security. Data encryption is a basic yet crucial practice for data security of your application so it is important to make arrangements for the safe storage of data.
Regular updates are required in applications to deal with prospective security issues.
Developing an app is a very time-consuming process. Awareness of the best practices in application development helps you save time, money, and resources.
To improve successful adoption and engagement of your app, the quality of your application development is a necessity, not a choice. Following the best app development practices also ensures the quality that will give you a large number of loyal customers.
If you’re looking for best-in-class app development, get in touch with the Perpetual team. We’d love to help you build your vision.
Jin Markov is a Content Writer with GoodFirms, a research firm in the USA. He loves reading about app development technologies while sipping his favorite cup of coffee.
I was born in New York but spent most of my life growing up in Hong Kong. I have hence always been drawn to organizations that expose me to a range of challenges and opportunities to learn across disciplines and borders. I have had the pleasure of working as a Product Manager at Perpetual for the past year and a half. In that time I’ve been involved in over 5 projects from healthcare to news production and even helped the city of New York solve energy conservation challenges while working with team members across the globe.
Every day holds a novel challenge here, as time sensitive requests and issues inevitably arise, meaning a Product Manager in this role needs to simultaneously be alert and ready to tackle things as they come while being able to handle them with a plan and process. In this time, I’ve learned important lessons that have led me to grow both personally and professionally that I want to share in this post.
From day one I have been involved in projects where I was given the license to become heavily involved with the client while working between teams. My first undertaking saw me working with an animal healthcare startup known as Roo. In the capacity as PM for this project, I began by understanding the current functionality of the platform which enabled me to begin planning a long term roadmap and priorities with the client. From there, I was able to create detailed user stories and then structure sprint plans over time.
I began supporting Roo at a time when the product was about to be launched to market, so prioritization and identifying launch critical issues became the most important part of my early involvement with the company. We assisted the client in setting up tools best suited for the challenge at hand, which included a project tracking tool, JIRA, along with a centralized document to easily log any critical issues observed in the field. These tools, along with a pragmatic and delivery focused process, resulted in the product getting to market in time, with critical issues addresses, and post-launch items prioritized and ready for the development team to seamlessly continue their delivery. You can learn more about the project in this Case Study.
Through this experience, I came to understand how quickly things move in the startup world and the importance of prioritization to keep track of tasks and handle them in the most effective way possible.
My next project was in the corporate world, which I learned moves at a different pace. In this case, our client was Thomson Reuters, a large multinational media company with over 25,000+ employees, which meant our team had to take a different approach to working with such a large client. Unlike the hyper agile nature of working with smaller startup companies, tasks can take longer and involve more people and teams, which means it was important for us to stay on top of dependencies and consistently highlight blockers to make sure we stayed on track.
The goal of this project was to help journalists speed up the output of certain types of news stories. This initiative involved taking an existing application that allows news editors to create drafts of recurring news articles, and templatizing them in order to create self-updating articles that would populate with information from a data source, ready to publish.
Early in the process, I worked with the legal editing team to see what types of articles they wrote on a weekly basis to try and ascertain which content types could be templatized. To do this, I underwent a review of articles written in a given week by the legal news team and began to draw conclusions about recurring topics such as plaintiffs, judges, and courts. With this information, I began to collaborate with our development team to perform data modelling on these inputs along with feedback from the legal editing team as part of our iterative process. The end product integrated novel legal data sets with the existing article templatization tool.
This undertaking taught me a lot about the process of iteration as we were consistently making progress while checking in with users and stakeholders. This allowed for a productive back and forth where we occasionally pivoted our approach as we gained and incorporated new information during the development process, resulting in a product that evolved to meet user needs. Another challenge in this project was building an end-to-end product for data vs. a well defined user interface, which pushed me to think about the value that different types of data can provide, without the benefit of a visual to guide this understanding.
While these two projects were focused more on defining and building products for our clients, I was also heavily involved in projects that were more focused on UX Design overhauls and improvements. In this role, I played the role of a Project Manager more than a Product Manager (see my post about Project Manager vs. Product Manager here).
Working with one of NYC’s largest moving companies, our team was tasked with revamping the look of the entire website and the way users navigate the various pages to improve overall move bookings. This project was unique due to the various stakeholders from different areas of the company being involved in the process, since different pages had varying requirements for what needed to be displayed, including business, marketing and legal.
For example, redesigning the long distance moving page required input from a specialized team involved with those customers, while creating a new insurance page required us to call in to the claims department to ensure we were stating the right information. This was key so as to not mislead prospective customers and occasionally, to adhere to legal terms. While designing all experiences, above all, marketing was a key consideration: we had to ensure our designs didn’t impact Search Engine Optimization (SEO) on the website. This meant ensuring our designs followed standard guidelines in terms of layout and mobile responsiveness, and accommodating content and copy optimized for SEO. This process involved working with the marketing team, an SEO expert and content writer. It was insightful to see how small changes we made drastically affected SEO performance, so a build-measure-learn approach was key in this process.
This project taught me to be flexible in light of situations where input can arrive from a variety of sources. Additionally, working between the development and design teams at Perpetual was an exciting opportunity in itself as it gave me the chance to interface between these disciplines and work together to realize common goals. You can learn more about the project in this Case Study.
In another User Experience focused project, where I played the role of Project Manager, we worked to revamp the entire product line for a unified communications company that looked to us for rebranding, design direction and most importantly user experience and interaction design as part of a larger company rebranding. This project allowed our design team to take a more ground up approach as we began the project by taking a full inventory of the existing products and reimagining what improvements could look like for end users. For this client, I acted as the liaison between our design team and our stakeholders in order to keep the project on track, while ensuring deliverables and key action items were followed up on in a timely manner. This gave me the chance to learn deeply about UX principles while gaining new insights into the intricacies behind product branding and advanced interaction design for a suite of enterprise products.
While client projects provide invaluable learning lessons across a range of industries, I was also given the opportunity to apply my knowledge to an internal project built from the ground up. As part of the team working on Perpetual’s ideative participation in the 2019 NYC BigApps Blockchain Innovation Challenge, I worked with our development team to create a blockchain backed reward platform aimed at improving carbon emitting behaviors. After a period of ideation, I went to work creating wireframes and user stories to inform the development team. Over time we brought our tool which we named “Power Chain” to life and began dogfooding our product among our team members to understand how users would interact with the self reporting portion of the product. Our hard work culminated in a pitch to the representatives of various NYC government agencies where the Perpetual team finished in the top 3 spot for the “Energy” category of the competition. (You can read more about it here.)
My work on “Power Chain” involved a period of thorough ideation with the team as we bounced ideas off each other and considered the feasibility of our ambitious attempt to change the energy consuming habits of our fellow New Yorkers. I also got to present the pitch (video here), honing my startup pitch and communication skills in the process.
As I mentioned at the start, being a Product Manager at Perpetual requires flexibility and perseverance. Working here, new projects and challenges are always on the horizon which keeps me on my toes and out of my comfort zone. As a result, the learning opportunities never stop coming and there are always different ways to apply yourself to the tasks at hand. Overall, my time here can be defined by the numerous lessons I’ve received in the ever-changing space of technology which I believe has the power to spark meaningful change in the world.
I’ve gained a better understanding of the process of iteration and it’s benefits to creating a well rounded product. I’ve also experienced the pace of working in the product development world and how to prioritize effectively in light of competing tasks. Most of all, it has become clear to me how interdisciplinary and engaging the role of a Product Manager truly is, and I am constantly reminded how much more there is to learn. As more new projects come down the pipeline, I am eager for new experiences and look forward to everything that lies ahead.
- George Molina is a Product Manager at Perpetual
There are too many sources of information about the CoronaVirus, and not all are credible and trustworthy. Here’s a helpful list of 5 reliable sources related to the spread of COVID-19 to keep you informed and aware, with an emphasis on guidelines, news and latest statistics.
1. The Center for Disease Control is maintaining a “Cases in the U.S.” page for visitors to get a better idea of the epidemic. Users have the ability to view number of cases at a glance, cases by exposure type, and cases by date of onset.
2. John Hopkins University has released a visual tool to view the spread of the virus across the world. Along with an interactive map, the tool includes the number of cases by country and is regularly updated with the latest information.
3. For New York residents, the New York State Department of Health is publishing updates from the state government to this site. Included are the number of cases by county as well as a COVID-19 hotline.
4. FlowingData is a data visualization site that aggregates various graphs, tables and more related to COVID-19 information like changes in foot traffic among cities, simulations for virus spread and more.
5. Thomson Reuters has created a Coronavirus resource center with up to date news articles as well as free resources for businesses as they work through this crisis.
The Perpetual team is monitoring the situation closely and we remain committed to staying informed from reliable sources and helping our community of employees, clients, partners and neighbors stay safe.
Have you ever willingly provided information to someone you just met? I’ve always been hesitant when it comes to giving out my information and signing up for something in person - this includes rewards programs and giving you my date of birth for a birthday treat. This all changed when I had a great experience with a membership staff at my local gym that influenced me to sign up for a membership on the spot. She was engaging, spoke in a calm matter, was not overly chatty, and truly listened to me. Sure, I could’ve signed up online or continued to take advantage of the free guest pass but there was something about the way she spoke to me that made me want to give her my credit card, address, first and last name AND even my date of birth. I thought wow, how can I take this experience and apply it to UX copywriting?
One of the challenges that I have faced in the past as a UX designer has been influencing a user to provide their information through my designs. How many of you hit ‘back’ or ‘exit’ once you are prompted to enter your contact information to be contacted by a representative? I know I am guilty of this. These short messages on an interface that you encounter are called microcopy. Examples of microcopy include short sentences, a word, or an error message that you see when using a product. While the design of the UI also plays a vital role, copy is a huge part of the user experience. Words are key to bringing a conversation to life.
Just like my conversation with the employee at my gym, microcopy needs to be clear, concise, and transparent. In order to engage in a conversation, you must first empathize with the user. When using microcopy to ask a user for their information, first inform them why that information is needed and what will be done with that information. Now let’s take a look at an example of bad microcopy and good microcopy in a multi-step conversational flow:
As you can see, the user has arrived at their final step and is asked to provide their payment information for a free trial. As a user, I would be expecting to sign up for a free trial without having to input my payment information. This unexpected step would deter me from signing up for this trial unless I was given more context as to what will be done with my credit card number or if/when I would be getting charged. Transparency is key when creating copy that requests financial information.
While transparency plays an important role in conversational microcopy, engaging and empathizing are also as essential. Just like meeting someone new for the first time, you find out their name and ask questions to get to know them a bit more. Once you learn more about the user, you uncover what brought them to your product and how you can help them. Providing extra context while keeping copy short builds trust and makes the user feel a closer connection to the brand.
Just like having consistency in your designs, consistency in your copy is just as important. This helps maintain your brand’s tone and voice. What is consistent visual design without consistent copy throughout your product? I have been fortunate enough to apply and expand my knowledge on product design here at Perpetual and this included learning that while maintaining consistent copy is great, you should also ensure grammar and punctuation contain no errors. As a user, it would be difficult to trust a product if it contained grammatical errors when asking me for my personal information. This is so obvious, but is surprisingly often overlooked. If you are UX copywriting and and you rely on spell check such as myself, I recommend looking into the Spell Check plugin for Sketch.
Tone of voice (eg funny, friendly), conversational interfaces, use of emojis and images are other tactics you can employ in using micro-copy to your advantage in creating good conversational interfaces. These various elements engage the user and give your product personality. One of the top UX trends of 2019 was making a form-page feel like a conversation. Lemonade has successfully made signing up for insurance coverage feel like having a conversation with a real person. Different flows are created based on the input of users which gives them a sense of empathy. Each option is accompanied by a representative icon providing visualization for the user and clarity on their selection. As you can see in the image below, the light and inviting microcopy is consistent with the iconography used.
Microcopy is not just copy but also a part of the design itself. Working with users and stakeholders has taught me that although you can create a visually appealing product, the experience will not be complete without good copy. The iterations I have done after receiving feedback for each of my deliverables have not only been visual design related but on the copy I used as well.
Analyzing the conversations I have with others on a daily basis has helped me to become more mindful when creating conversational UX copy while maintaining a client’s brand tone and voice. Next time you find yourself signing up for an account online or entering your payment information, think to yourself - how much is the copy influencing your decision?
-Jackie Chan is a UX Designer at Perpetual