Thank you for applying to join our team at Kin + Carta Create! We'd now like to see an example of how you work.
👋 If you haven't applied yet, please do so via https://www.kinandcarta.com/services/create/careers. We cannot accept submitted code without a prior application.
Please build an app to showcase a small sample of some of the amazing work Kin + Carta Create has delivered over the years.
You are required to show the list of Kin + Carta Create case studies available here. Please embed the URL below into your codebase. On launch, the app should always fetch the latest case studies from the given URL. If we add more case studies in the future, your app will display the up-to-date list. Do not read from hardcoded JSON. Do not embed images within the app, download them from the URLs provided within the JSON.
Fetch from the following URL:
https://raw.githubusercontent.com/theappbusiness/engineering-challenge/main/endpoints/v1/caseStudies.json
The requirements are broken down into two user stories:
- KCC-001: As a user, I want to see a list of case studies with an image and teaser.
- KCC-002: As a user, I want to read the full article when I select a case study from the list.
While completing these user stories, you may wish to commit your code to a local Git repository.
When you are done, please send via email the zipped up directory containing your project.
⚠️ Please do not push your work to a public repository.
If you make intermediate commits to a local repository, the most important thing is that you are proud of the code submitted at the end. Don't worry about the code cleanliness or robustness of earlier commits.
Please structure the code as you would for a production app that will be extended and maintained in the future. There is no need to leave comments in the code, as long as the code is self-documenting.
You can see an example of how our case studies appear on the Kin + Carta website. However, we expect the user experience to vary between a mobile app and the website. Please put your own stamp on the project to make something that looks and feels great on the target operating system.
ℹ️ A good place to start is to look at the JSON and the website together. You will see how the keys in the JSON relate to the content on the website. By doing this, you will see the keys that you will need to use to deliver your solution. There are additional keys in the JSON that you are not required to make use of.
The acceptance criteria are open to your interpretation and creativity. If in doubt, do what feels right or ask for clarification.
- When opening the app, the user should see the list of case studies available in the JSON at the given URL.
- The user should see the list of case studies as per the array value for the
"case_studies"
key in the JSON. - For each case study in the list, the user should see:
- a hero image, downloaded from the URL value provided for the
"hero_image"
key (do not embed images within the app); - teaser text as per the
"teaser"
key in the JSON.
- a hero image, downloaded from the URL value provided for the
⚠️ Any case study JSON object with insufficient information should be ignored, e.g. if the"teaser"
field is missing.
- The user can navigate to read a full article by selecting a case study from the list.
- For the full article, the user should see:
- a hero image, downloaded from the URL value provided for the
"hero_image"
key (do not embed images within the app); - the title as per the
"title"
key; - body content broken into sections, as per the array value for the
"sections"
key;
- a hero image, downloaded from the URL value provided for the
- For each section of body content, the user should see:
- the section title (if provided in the JSON). This should be in a strong font weight to distinguish it from body text. It is read from the section's
"title"
key; - a list of body elements (either text or images). These are read from the
"body_elements"
key; - any images within the sections of body content should be downloaded from the URL provided for the
image_url
key.
- the section title (if provided in the JSON). This should be in a strong font weight to distinguish it from body text. It is read from the section's
- The user should be able to easily return to the full list of case studies (delivered in KCC-001).
- Body text is given as a string in the
"body_elements"
array. - In-line images are represented as JSON objects with a single key
"image_url"
. These should be displayed in-line as they appear between text in the JSON.
If you're applying for an iOS Engineering position, please read the additional requirements for iOS.
No designs are provided. As such, you can put your own creative stamp on the delivered software. You are encouraged to add any nice touches that you feel showcase your abilities. However, the most important thing is that your code works, it is well structured and it meets the acceptance criteria laid out above.
Please don't hesitate to contact us with any questions. It's better to ask clarification questions up front.