How to use Adobe XD CC beta version

What is Adobe Experience Design CC?

Have you ever imagine if you have a client that ask you to design mobile apps, website or anything else with interactivity and then traditionally maybe you are using illustrator, photoshop or event third party apps to design it, then you have to show it to a client’s and ask them to imagine if you will click this button it takes you to this page.

Then now, Adobe is building an application that actually lets you, not to only design it but actually put that interaction so your clients don’t have to imagine if they click this button it goes to other pages that can actually click and go to that page.

It’s not an app builder, it’s not a web builder it doesn’t write HTML, and didn’t write any code at all. It just basically allows you to create your design very similar to what you would do in photoshop or illustrator and then let you prototype or send your designs as a working model to your clients. That’s what Adobe XD is.

Let’s take a look at how it works.

    1. Create the new project.
      welcomescreen.png
      Welcome screen Adobe XD beta version

      You can start with a mobile phone with a prompt to default to an iPhone 6/7 but you can switch to different iPhone, you can switch to an iPad or Web or you can choose a custom size.

      The workspace is divided into two views, Design and Prototype. In the design view, you can use a number of tools and features to create design layout, add artboards and import resources from other applications.

      In the Design view, you can use a number of tools and features to create design layout, add artboards and import resources from other applications.

      In the Prototype view, you can link between artboards (pages) and define the relationship between them through interactions.

      Once it’s done, you can preview it by clicking the play button on the top right.

    2. Choose the artboard, for instance, iPhone 6/7.
    3. Setup the Welcome Page, click rectangle icon from the Tools panel on the right. If you want to make the round edge, click and drag the dot inside the rectangle. Click File > Import, choose any picture for your background.
    4. Build the content area, repeat the same step.
    5. Add the Content.
    6. Creating content.
      You can create multiple contents without duplicating them manually. Click Rectangle, then click repeat grid button in the properties panel. You can drag the grid to the right or bottom.ss_okinawa_grid.png
    7. Build the linkage between pages. In order to link between the pages, select the page, click on the blue arrow to the right page. The target floating menu appears; select the target page, and set the transition animation type (for example “Dissolve”). Repeat this step to link between the other pages.linked
    8. There are two main methods to preview it. First, is the preview feature within Adobe XD itself just click the play button. Second, you can preview it from your device connected via USB.preview.png
    9. You can record your prototype which allows you to record the flow between pages and save to .Mov format.
    10. Sharing the prototype.We’re done! Now we can share the prototype with other team members who aren’t necessarily using XD. Just click share and copy the link and shared between team members.You can see the sample from here

Building a Bot with Chatfuel without Coding

One of the most easy to create chatbot platforms on the market is Chatfuel. You don’t even need complex programming skills, and you can create chatbots to engage with your audience on messengers.

For this example, I will make a chatbot to learn American Sign Language. The Facebook page is ASLBOT.

Disclaimer: (ASLBOT Facebook Page) None of these photos and videos belong to me unless stated otherwise. If you feel that your photo has wrongly been used feel free to message me and ask me.

I will show you how to make a simple chatbot for Facebook messenger.

  1. Create an account in Chatfuel, by connecting your Facebook account with a click of single button.Screen Shot 2017-02-21 at 1.29.58 PM.png
  2. Choose a template or create a blank chatbot.
    You can choose from Full-Featured Templates or click Create a blank Chatbot. As we will be building a bot from scratch, choose create a blank chatbot. Once it’s done, you can rename it by clicking the gear icon. For this example, I will rename it to ASLBot.Screen Shot 2017-02-21 at 1.54.08 PM.png
  3. It’s time to edit, you can add content to your bot, it can be text cards or images and you can set up AI rules in the AI Setup to make your bot understand the messages.
  4. You can always test your bot before connecting it to your Facebook page.
  5. When you are ready to publish to the world you can choose the menu “Configure” from the Chatfuel Dashboard.screen-shot-2017-02-21-at-2-01-03-pm
  6. Once it published, you can promote your bot to the world.Screen Shot 2017-02-21 at 2.28.08 PM.png
  7. You can try the ASLBot and can see the result here.

How To Open Task Manager For Mac

  • Press Command + Space key to launch Spotlight search.
  • Type ” Activity Monitor” 

Screen Shot 2016-04-30 at 8.35.49 PM

it’s the same like Task Manager in Windows.

Screen Shot 2016-04-30 at 8.49.28 PM

If you want to force quit an application that doesn’t respond, press this key combination: Command + Option + Esc to bring up Force Quit Appplication. Select the application that  you want to close, and click on Force Quit.

Screen Shot 2016-04-30 at 8.57.47 PM.png